/* This file is generated automatically by Design Sync. Do not edit this file directly. */ Design Tokens Documentation

Design Tokens Documentation

🎨 Color Palettes

kda.foundation

blue
primary
secondary
tertiary
primary
secondary
tertiary
celery
+759 more

📦 Blur 2

kda.foundation.effect.blur.0

This is the layer blur description

Value:
Usage Examples
CSS Variable: var(--kda-foundation-effect-blur-0)
JavaScript: tokens.kda.foundation.effect.blur.0
kda.foundation.effect.defaultBlur

This is the default layer blur description

Value:
Usage Examples
CSS Variable: var(--kda-foundation-effect-defaultBlur)
JavaScript: tokens.kda.foundation.effect.defaultBlur

🔲 Borders 3

kda.foundation.border.hairline
Value: 1px solid #252f3a40
Usage Examples
CSS Variable: var(--kda-foundation-border-hairline)
JavaScript: tokens.kda.foundation.border.hairline
kda.foundation.border.normal
Value: 2px solid #020e1b80
Usage Examples
CSS Variable: var(--kda-foundation-border-normal)
JavaScript: tokens.kda.foundation.border.normal
kda.foundation.border.thick
Value: 4px solid #020e1b80
Usage Examples
CSS Variable: var(--kda-foundation-border-thick)
JavaScript: tokens.kda.foundation.border.thick

🎨 Colors 767

kda.foundation.color.accent.blue
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-blue)
JavaScript: tokens.kda.foundation.color.accent.blue
kda.foundation.color.accent.brand.primary
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-brand-primary)
JavaScript: tokens.kda.foundation.color.accent.brand.primary
kda.foundation.color.accent.brand.secondary
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-brand-secondary)
JavaScript: tokens.kda.foundation.color.accent.brand.secondary
kda.foundation.color.accent.brand.tertiary
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-brand-tertiary)
JavaScript: tokens.kda.foundation.color.accent.brand.tertiary
kda.foundation.color.accent.brand.tint.primary
Value: #52FFC6
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-brand-tint-primary)
JavaScript: tokens.kda.foundation.color.accent.brand.tint.primary
kda.foundation.color.accent.brand.tint.secondary
Value: #E41968
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-brand-tint-secondary)
JavaScript: tokens.kda.foundation.color.accent.brand.tint.secondary
kda.foundation.color.accent.brand.tint.tertiary
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-brand-tint-tertiary)
JavaScript: tokens.kda.foundation.color.accent.brand.tint.tertiary
kda.foundation.color.accent.celery
Value: #07a721
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-celery)
JavaScript: tokens.kda.foundation.color.accent.celery
kda.foundation.color.accent.green
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-green)
JavaScript: tokens.kda.foundation.color.accent.green
kda.foundation.color.accent.magenta
Value: #E41968
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-magenta)
JavaScript: tokens.kda.foundation.color.accent.magenta
kda.foundation.color.accent.orange
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-orange)
JavaScript: tokens.kda.foundation.color.accent.orange
kda.foundation.color.accent.red
Value: #F75C46
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-red)
JavaScript: tokens.kda.foundation.color.accent.red
kda.foundation.color.accent.semantic.info
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-semantic-info)
JavaScript: tokens.kda.foundation.color.accent.semantic.info
kda.foundation.color.accent.semantic.negative
Value: #F75C46
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-semantic-negative)
JavaScript: tokens.kda.foundation.color.accent.semantic.negative
kda.foundation.color.accent.semantic.positive
Value: #07a721
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-semantic-positive)
JavaScript: tokens.kda.foundation.color.accent.semantic.positive
kda.foundation.color.accent.semantic.warning
Value: #B08C00
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-semantic-warning)
JavaScript: tokens.kda.foundation.color.accent.semantic.warning
kda.foundation.color.accent.yellow
Value: #B08C00
Usage Examples
CSS Variable: var(--kda-foundation-color-accent-yellow)
JavaScript: tokens.kda.foundation.color.accent.yellow
kda.foundation.color.background.accent.primary.@active
Value: #7AFFD3
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-@active)
JavaScript: tokens.kda.foundation.color.background.accent.primary.@active
kda.foundation.color.background.accent.primary.@focus
Value: #52ffc6cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-@focus)
JavaScript: tokens.kda.foundation.color.background.accent.primary.@focus
kda.foundation.color.background.accent.primary.@hover
Value: #4BE9B5
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-@hover)
JavaScript: tokens.kda.foundation.color.background.accent.primary.@hover
kda.foundation.color.background.accent.primary.default
Value: #52FFC6
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-default)
JavaScript: tokens.kda.foundation.color.background.accent.primary.default
kda.foundation.color.background.accent.primary.inverse.@active
Value: #27795E
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.accent.primary.inverse.@active
kda.foundation.color.background.accent.primary.inverse.@focus
Value: #27795ecc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.accent.primary.inverse.@focus
kda.foundation.color.background.accent.primary.inverse.@hover
Value: #2E8F6F
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.accent.primary.inverse.@hover
☀️ light
🌙 dark
kda.foundation.color.background.accent.primary.inverse.default
Value: #20624C
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-primary-inverse-default)
JavaScript: tokens.kda.foundation.color.background.accent.primary.inverse.default
kda.foundation.color.background.accent.secondary.@active
Value: #CF175E
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-@active)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.@active
kda.foundation.color.background.accent.secondary.@focus
Value: #CF175E
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-@focus)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.@focus
kda.foundation.color.background.accent.secondary.@hover
Value: #CF175E
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-@hover)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.@hover
kda.foundation.color.background.accent.secondary.default
Value: #E41968
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-default)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.default
kda.foundation.color.background.accent.secondary.inverse.@active
Value: #E93C7F
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.inverse.@active
kda.foundation.color.background.accent.secondary.inverse.@focus
Value: #E93C7F
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.inverse.@focus
kda.foundation.color.background.accent.secondary.inverse.@hover
Value: #E93C7F
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.inverse.@hover
kda.foundation.color.background.accent.secondary.inverse.default
Value: #E41968
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-secondary-inverse-default)
JavaScript: tokens.kda.foundation.color.background.accent.secondary.inverse.default
kda.foundation.color.background.accent.tertiary.@active
Value: #CB5D00
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-@active)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.@active
kda.foundation.color.background.accent.tertiary.@focus
Value: #CB5D00
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-@focus)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.@focus
kda.foundation.color.background.accent.tertiary.@hover
Value: #CB5D00
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-@hover)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.@hover
kda.foundation.color.background.accent.tertiary.default
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-default)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.default
kda.foundation.color.background.accent.tertiary.inverse.@active
Value: #EC9046
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.inverse.@active
kda.foundation.color.background.accent.tertiary.inverse.@focus
Value: #EC9046
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.inverse.@focus
kda.foundation.color.background.accent.tertiary.inverse.@hover
Value: #EC9046
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.inverse.@hover
kda.foundation.color.background.accent.tertiary.inverse.default
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-background-accent-tertiary-inverse-default)
JavaScript: tokens.kda.foundation.color.background.accent.tertiary.inverse.default
kda.foundation.color.background.base.@active
Value: #E4E5E5
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-@active)
JavaScript: tokens.kda.foundation.color.background.base.@active
kda.foundation.color.background.base.@disabled
Value: #0000001a
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-@disabled)
JavaScript: tokens.kda.foundation.color.background.base.@disabled
kda.foundation.color.background.base.@focus
Value: #e4e5e5cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-@focus)
JavaScript: tokens.kda.foundation.color.background.base.@focus
kda.foundation.color.background.base.@hover
Value: #D2D4D6
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-@hover)
JavaScript: tokens.kda.foundation.color.background.base.@hover
kda.foundation.color.background.base.default
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-default)
JavaScript: tokens.kda.foundation.color.background.base.default
kda.foundation.color.background.base.inverse.@disabled
Value: #ffffff1a
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.background.base.inverse.@disabled
kda.foundation.color.background.base.inverse.@focus
Value: #131e2bcc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.base.inverse.@focus
kda.foundation.color.background.base.inverse.@hover
Value: #252F3A
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.base.inverse.@hover
kda.foundation.color.background.base.inverse.default
Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-inverse-default)
JavaScript: tokens.kda.foundation.color.background.base.inverse.default
kda.foundation.color.background.base.inverse.warm
Value: #0F0F0F
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-inverse-warm)
JavaScript: tokens.kda.foundation.color.background.base.inverse.warm
kda.foundation.color.background.base.warm
Value: #F0EAE6
Usage Examples
CSS Variable: var(--kda-foundation-color-background-base-warm)
JavaScript: tokens.kda.foundation.color.background.base.warm
kda.foundation.color.background.brand.primary.@active
Value: #76B39B
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-@active)
JavaScript: tokens.kda.foundation.color.background.brand.primary.@active
kda.foundation.color.background.brand.primary.@focus
Value: #8CC4AD
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-@focus)
JavaScript: tokens.kda.foundation.color.background.brand.primary.@focus
kda.foundation.color.background.brand.primary.@hover
Value: #A2D5BE
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-@hover)
JavaScript: tokens.kda.foundation.color.background.brand.primary.@hover
kda.foundation.color.background.brand.primary.default
Value: #B8E7CF
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-default)
JavaScript: tokens.kda.foundation.color.background.brand.primary.default
kda.foundation.color.background.brand.primary.inverse.@active
Value: #356F5A
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.brand.primary.inverse.@active
kda.foundation.color.background.brand.primary.inverse.@focus
Value: #2A5F4B
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.brand.primary.inverse.@focus
kda.foundation.color.background.brand.primary.inverse.@hover
Value: #1F4F3C
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.brand.primary.inverse.@hover
kda.foundation.color.background.brand.primary.inverse.default
Value: #153E2C
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-inverse-default)
JavaScript: tokens.kda.foundation.color.background.brand.primary.inverse.default
kda.foundation.color.background.brand.primary.inverse.subtle
Value: #0A2E1D
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-inverse-subtle)
JavaScript: tokens.kda.foundation.color.background.brand.primary.inverse.subtle
kda.foundation.color.background.brand.primary.inverse.subtlest
Value: #061A10
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-inverse-subtlest)
JavaScript: tokens.kda.foundation.color.background.brand.primary.inverse.subtlest
kda.foundation.color.background.brand.primary.subtle
Value: #CEF8E0
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-subtle)
JavaScript: tokens.kda.foundation.color.background.brand.primary.subtle
kda.foundation.color.background.brand.primary.subtlest
Value: #E9F8EF
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-primary-subtlest)
JavaScript: tokens.kda.foundation.color.background.brand.primary.subtlest
kda.foundation.color.background.brand.secondary.@active
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-@active)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.@active
kda.foundation.color.background.brand.secondary.@focus
Value: #A0CBF4
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-@focus)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.@focus
kda.foundation.color.background.brand.secondary.@hover
Value: #BBDBF9
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-@hover)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.@hover
kda.foundation.color.background.brand.secondary.default
Value: #BBDBF9
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-default)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.default
kda.foundation.color.background.brand.secondary.inverse.@active
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.inverse.@active
kda.foundation.color.background.brand.secondary.inverse.@focus
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.inverse.@focus
kda.foundation.color.background.brand.secondary.inverse.@hover
Value: #112C46
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.inverse.@hover
kda.foundation.color.background.brand.secondary.inverse.default
Value: #112C46
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-inverse-default)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.inverse.default
kda.foundation.color.background.brand.secondary.inverse.subtle
Value: #0B1D2E
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-inverse-subtle)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.inverse.subtle
kda.foundation.color.background.brand.secondary.inverse.subtlest
Value: #06101A
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-inverse-subtlest)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.inverse.subtlest
kda.foundation.color.background.brand.secondary.subtle
Value: #D6EBFF
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-subtle)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.subtle
kda.foundation.color.background.brand.secondary.subtlest
Value: #F0F8FF
Usage Examples
CSS Variable: var(--kda-foundation-color-background-brand-secondary-subtlest)
JavaScript: tokens.kda.foundation.color.background.brand.secondary.subtlest
kda.foundation.color.background.input.@active
Value: #E4E5E5
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-@active)
JavaScript: tokens.kda.foundation.color.background.input.@active
kda.foundation.color.background.input.@disabled
Value: #0000001a
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-@disabled)
JavaScript: tokens.kda.foundation.color.background.input.@disabled
kda.foundation.color.background.input.@focus
Value: #e4e5e5cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-@focus)
JavaScript: tokens.kda.foundation.color.background.input.@focus
☀️ light
🌙 dark
kda.foundation.color.background.input.@hover
Value: #D2D4D6
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-@hover)
JavaScript: tokens.kda.foundation.color.background.input.@hover
☀️ light
🌙 dark
kda.foundation.color.background.input.default
Value: #f5f5f5cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-default)
JavaScript: tokens.kda.foundation.color.background.input.default
kda.foundation.color.background.input.inverse.@active
Value: #131E2B
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.input.inverse.@active
kda.foundation.color.background.input.inverse.@disabled
Value: #ffffff1a
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.background.input.inverse.@disabled
kda.foundation.color.background.input.inverse.@focus
Value: #131e2bcc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.input.inverse.@focus
kda.foundation.color.background.input.inverse.@hover
Value: #252F3A
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.input.inverse.@hover
☀️ light
🌙 dark
kda.foundation.color.background.input.inverse.default
Value: #475059cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-input-inverse-default)
JavaScript: tokens.kda.foundation.color.background.input.inverse.default
☀️ light
🌙 dark
kda.foundation.color.background.layer.default
Value: #ffffffcc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-layer-default)
JavaScript: tokens.kda.foundation.color.background.layer.default
☀️ light
🌙 dark
kda.foundation.color.background.layer.solid
Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-background-layer-solid)
JavaScript: tokens.kda.foundation.color.background.layer.solid
☀️ light
🌙 dark
kda.foundation.color.background.overlay.@hover
Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-background-overlay-@hover)
JavaScript: tokens.kda.foundation.color.background.overlay.@hover
☀️ light
🌙 dark
kda.foundation.color.background.overlay.context.default
Value: #fffffff2
Usage Examples
CSS Variable: var(--kda-foundation-color-background-overlay-context-default)
JavaScript: tokens.kda.foundation.color.background.overlay.context.default
☀️ light
🌙 dark
kda.foundation.color.background.overlay.default
Value: #fffffff2
Usage Examples
CSS Variable: var(--kda-foundation-color-background-overlay-default)
JavaScript: tokens.kda.foundation.color.background.overlay.default
kda.foundation.color.background.semantic.info.@active
Value: #A0CBF4
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.info.@active
kda.foundation.color.background.semantic.info.@focus
Value: #86bceecc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.info.@focus
kda.foundation.color.background.semantic.info.@hover
Value: #6BACE8
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.info.@hover
kda.foundation.color.background.semantic.info.default
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-default)
JavaScript: tokens.kda.foundation.color.background.semantic.info.default
kda.foundation.color.background.semantic.info.inverse.@active
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.info.inverse.@active
kda.foundation.color.background.semantic.info.inverse.@focus
Value: #205586cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.info.inverse.@focus
kda.foundation.color.background.semantic.info.inverse.@hover
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.info.inverse.@hover
kda.foundation.color.background.semantic.info.inverse.default
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-inverse-default)
JavaScript: tokens.kda.foundation.color.background.semantic.info.inverse.default
kda.foundation.color.background.semantic.info.inverse.subtle
Value: #20558633
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-inverse-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.info.inverse.subtle
kda.foundation.color.background.semantic.info.inverse.subtlest
Value: #06101A
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-inverse-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.info.inverse.subtlest
kda.foundation.color.background.semantic.info.subtle
Value: #86bcee33
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.info.subtle
kda.foundation.color.background.semantic.info.subtlest
Value: #F0F8FF
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-info-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.info.subtlest
kda.foundation.color.background.semantic.negative.@active
Value: #FFCDC3
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.@active
kda.foundation.color.background.semantic.negative.@focus
Value: #ffb7a9cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.@focus
kda.foundation.color.background.semantic.negative.@hover
Value: #FF9B88
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.@hover
kda.foundation.color.background.semantic.negative.default
Value: #FFB7A9
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-default)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.default
kda.foundation.color.background.semantic.negative.inverse.@active
Value: #930000
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.inverse.@active
kda.foundation.color.background.semantic.negative.inverse.@focus
Value: #b40000cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.inverse.@focus
kda.foundation.color.background.semantic.negative.inverse.@hover
Value: #D31510
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.inverse.@hover
kda.foundation.color.background.semantic.negative.inverse.default
Value: #B40000
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-inverse-default)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.inverse.default
kda.foundation.color.background.semantic.negative.inverse.subtle
Value: #b4000033
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-inverse-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.inverse.subtle
kda.foundation.color.background.semantic.negative.inverse.subtlest
Value: #330000
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-inverse-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.inverse.subtlest
kda.foundation.color.background.semantic.negative.subtle
Value: #ffb7a933
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.subtle
kda.foundation.color.background.semantic.negative.subtlest
Value: #FFF5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-negative-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.negative.subtlest
kda.foundation.color.background.semantic.positive.@active
Value: #96ee85
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.@active
kda.foundation.color.background.semantic.positive.@focus
Value: #72e06acc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.@focus
kda.foundation.color.background.semantic.positive.@hover
Value: #4ecf50
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.@hover
kda.foundation.color.background.semantic.positive.default
Value: #72e06a
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-default)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.default
kda.foundation.color.background.semantic.positive.inverse.@active
Value: #00530d
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.inverse.@active
kda.foundation.color.background.semantic.positive.inverse.@focus
Value: #00670fcc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.inverse.@focus
kda.foundation.color.background.semantic.positive.inverse.@hover
Value: #007c0f
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.inverse.@hover
kda.foundation.color.background.semantic.positive.inverse.default
Value: #00670f
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-inverse-default)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.inverse.default
kda.foundation.color.background.semantic.positive.inverse.subtle
Value: #00670f33
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-inverse-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.inverse.subtle
kda.foundation.color.background.semantic.positive.inverse.subtlest
Value: #001A04
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-inverse-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.inverse.subtlest
kda.foundation.color.background.semantic.positive.subtle
Value: #72e06a33
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.subtle
kda.foundation.color.background.semantic.positive.subtlest
Value: #E9FCE3
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-positive-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.positive.subtlest
kda.foundation.color.background.semantic.warning.@active
Value: #F8D904
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.@active
kda.foundation.color.background.semantic.warning.@focus
Value: #e8c600cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.@focus
kda.foundation.color.background.semantic.warning.@hover
Value: #D7B300
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.@hover
kda.foundation.color.background.semantic.warning.default
Value: #E8C600
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-default)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.default
kda.foundation.color.background.semantic.warning.inverse.@active
Value: #5B4300
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-inverse-@active)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.inverse.@active
kda.foundation.color.background.semantic.warning.inverse.@focus
Value: #705300cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-inverse-@focus)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.inverse.@focus
kda.foundation.color.background.semantic.warning.inverse.@hover
Value: #856600
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-inverse-@hover)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.inverse.@hover
kda.foundation.color.background.semantic.warning.inverse.default
Value: #705300
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-inverse-default)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.inverse.default
kda.foundation.color.background.semantic.warning.inverse.subtle
Value: #70530033
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-inverse-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.inverse.subtle
kda.foundation.color.background.semantic.warning.inverse.subtlest
Value: #1A1100
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-inverse-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.inverse.subtlest
kda.foundation.color.background.semantic.warning.subtle
Value: #e8c60033
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-subtle)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.subtle
kda.foundation.color.background.semantic.warning.subtlest
Value: #FBF8DD
Usage Examples
CSS Variable: var(--kda-foundation-color-background-semantic-warning-subtlest)
JavaScript: tokens.kda.foundation.color.background.semantic.warning.subtlest
☀️ light
🌙 dark
kda.foundation.color.background.skeleton.default
Value: #D2D4D6
Usage Examples
CSS Variable: var(--kda-foundation-color-background-skeleton-default)
JavaScript: tokens.kda.foundation.color.background.skeleton.default
☀️ light
🌙 dark
kda.foundation.color.background.surface.default
Value: #020e1b0f
Usage Examples
CSS Variable: var(--kda-foundation-color-background-surface-default)
JavaScript: tokens.kda.foundation.color.background.surface.default
☀️ light
🌙 dark
kda.foundation.color.background.surface.inverse.default
Value: #020e1bcc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-surface-inverse-default)
JavaScript: tokens.kda.foundation.color.background.surface.inverse.default
☀️ light
🌙 dark
kda.foundation.color.background.surface.subtle.default
Value: #020e1b08
Usage Examples
CSS Variable: var(--kda-foundation-color-background-surface-subtle-default)
JavaScript: tokens.kda.foundation.color.background.surface.subtle.default
☀️ light
🌙 dark
kda.foundation.color.background.surface.subtle.inverse.default
Value: #020e1bcc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-surface-subtle-inverse-default)
JavaScript: tokens.kda.foundation.color.background.surface.subtle.inverse.default
☀️ light
🌙 dark
kda.foundation.color.background.surfaceHighContrast.default
Value: #ffffffe6
Usage Examples
CSS Variable: var(--kda-foundation-color-background-surfaceHighContrast-default)
JavaScript: tokens.kda.foundation.color.background.surfaceHighContrast.default
☀️ light
🌙 dark
kda.foundation.color.background.surfaceHighContrast.inverse.default
Value: #000000e6
Usage Examples
CSS Variable: var(--kda-foundation-color-background-surfaceHighContrast-inverse-default)
JavaScript: tokens.kda.foundation.color.background.surfaceHighContrast.inverse.default
☀️ light
🌙 dark
kda.foundation.color.background.table.row.@hover
Value: #f5f5f5cc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-table-row-@hover)
JavaScript: tokens.kda.foundation.color.background.table.row.@hover
kda.foundation.color.background.table.row.default
Value: #ffffffcc
Usage Examples
CSS Variable: var(--kda-foundation-color-background-table-row-default)
JavaScript: tokens.kda.foundation.color.background.table.row.default
kda.foundation.color.border.base.@active
Value: #475059
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-@active)
JavaScript: tokens.kda.foundation.color.border.base.@active
kda.foundation.color.border.base.@disabled
Value: #B0B3B7
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-@disabled)
JavaScript: tokens.kda.foundation.color.border.base.@disabled
kda.foundation.color.border.base.@focus
Value: #6A7178
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-@focus)
JavaScript: tokens.kda.foundation.color.border.base.@focus
kda.foundation.color.border.base.@hover
Value: #B0B3B7
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-@hover)
JavaScript: tokens.kda.foundation.color.border.base.@hover
kda.foundation.color.border.base.bold
Value: #020e1b80
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-bold)
JavaScript: tokens.kda.foundation.color.border.base.bold
kda.foundation.color.border.base.boldest
Value: #000000b3
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-boldest)
JavaScript: tokens.kda.foundation.color.border.base.boldest
kda.foundation.color.border.base.default
Value: #252f3a40
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-default)
JavaScript: tokens.kda.foundation.color.border.base.default
kda.foundation.color.border.base.high-contrast
Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-high-contrast)
JavaScript: tokens.kda.foundation.color.border.base.high-contrast
kda.foundation.color.border.base.inverse.@active
Value: #475059
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-@active)
JavaScript: tokens.kda.foundation.color.border.base.inverse.@active
kda.foundation.color.border.base.inverse.@disabled
Value: #B0B3B7
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.border.base.inverse.@disabled
kda.foundation.color.border.base.inverse.@focus
Value: #6A7178
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-@focus)
JavaScript: tokens.kda.foundation.color.border.base.inverse.@focus
kda.foundation.color.border.base.inverse.@hover
Value: #B0B3B7
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-@hover)
JavaScript: tokens.kda.foundation.color.border.base.inverse.@hover
kda.foundation.color.border.base.inverse.bold
Value: #ffffff66
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-bold)
JavaScript: tokens.kda.foundation.color.border.base.inverse.bold
kda.foundation.color.border.base.inverse.boldest
Value: #f5f5f580
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-boldest)
JavaScript: tokens.kda.foundation.color.border.base.inverse.boldest
kda.foundation.color.border.base.inverse.default
Value: #f5f5f533
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-default)
JavaScript: tokens.kda.foundation.color.border.base.inverse.default
kda.foundation.color.border.base.inverse.high-contrast
Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-high-contrast)
JavaScript: tokens.kda.foundation.color.border.base.inverse.high-contrast
kda.foundation.color.border.base.inverse.subtle
Value: #f5f5f51a
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-inverse-subtle)
JavaScript: tokens.kda.foundation.color.border.base.inverse.subtle
☀️ light
🌙 dark
kda.foundation.color.border.base.subtle
Value: #d2d4d6cc
Usage Examples
CSS Variable: var(--kda-foundation-color-border-base-subtle)
JavaScript: tokens.kda.foundation.color.border.base.subtle
kda.foundation.color.border.brand.primary.@focus
Value: #356F5A
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-primary-@focus)
JavaScript: tokens.kda.foundation.color.border.brand.primary.@focus
kda.foundation.color.border.brand.primary.@hover
Value: #3F806A
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-primary-@hover)
JavaScript: tokens.kda.foundation.color.border.brand.primary.@hover
kda.foundation.color.border.brand.primary.default
Value: #60A18A
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-primary-default)
JavaScript: tokens.kda.foundation.color.border.brand.primary.default
kda.foundation.color.border.brand.primary.inverse.@focus
Value: #3F806A
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-primary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.border.brand.primary.inverse.@focus
kda.foundation.color.border.brand.primary.inverse.@hover
Value: #356F5A
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-primary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.border.brand.primary.inverse.@hover
kda.foundation.color.border.brand.primary.inverse.default
Value: #2A5F4B
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-primary-inverse-default)
JavaScript: tokens.kda.foundation.color.border.brand.primary.inverse.default
kda.foundation.color.border.brand.primary.subtle
Value: #8CC4AD
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-primary-subtle)
JavaScript: tokens.kda.foundation.color.border.brand.primary.subtle
kda.foundation.color.border.brand.secondary.@focus
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-secondary-@focus)
JavaScript: tokens.kda.foundation.color.border.brand.secondary.@focus
kda.foundation.color.border.brand.secondary.@hover
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-secondary-@hover)
JavaScript: tokens.kda.foundation.color.border.brand.secondary.@hover
kda.foundation.color.border.brand.secondary.default
Value: #509CE3
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-secondary-default)
JavaScript: tokens.kda.foundation.color.border.brand.secondary.default
kda.foundation.color.border.brand.secondary.inverse.@focus
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-secondary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.border.brand.secondary.inverse.@focus
kda.foundation.color.border.brand.secondary.inverse.@hover
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-secondary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.border.brand.secondary.inverse.@hover
kda.foundation.color.border.brand.secondary.inverse.default
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-secondary-inverse-default)
JavaScript: tokens.kda.foundation.color.border.brand.secondary.inverse.default
kda.foundation.color.border.brand.secondary.subtle
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-border-brand-secondary-subtle)
JavaScript: tokens.kda.foundation.color.border.brand.secondary.subtle
kda.foundation.color.border.overlay.context
Value: #b0b3b7cc
Usage Examples
CSS Variable: var(--kda-foundation-color-border-overlay-context)
JavaScript: tokens.kda.foundation.color.border.overlay.context
kda.foundation.color.border.semantic.info.@disabled
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-@disabled)
JavaScript: tokens.kda.foundation.color.border.semantic.info.@disabled
kda.foundation.color.border.semantic.info.@focus
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.info.@focus
kda.foundation.color.border.semantic.info.@hover
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.info.@hover
kda.foundation.color.border.semantic.info.default
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-default)
JavaScript: tokens.kda.foundation.color.border.semantic.info.default
kda.foundation.color.border.semantic.info.inverse.@focus
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-inverse-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.info.inverse.@focus
kda.foundation.color.border.semantic.info.inverse.@hover
Value: #6BACE8
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-inverse-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.info.inverse.@hover
kda.foundation.color.border.semantic.info.inverse.default
Value: #509CE3
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-inverse-default)
JavaScript: tokens.kda.foundation.color.border.semantic.info.inverse.default
☀️ light
🌙 dark
kda.foundation.color.border.semantic.info.subtle
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-info-subtle)
JavaScript: tokens.kda.foundation.color.border.semantic.info.subtle
kda.foundation.color.border.semantic.negative.@disabled
Value: #FFB7A9
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-@disabled)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.@disabled
kda.foundation.color.border.semantic.negative.@focus
Value: #EA3829
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.@focus
kda.foundation.color.border.semantic.negative.@hover
Value: #D31510
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.@hover
kda.foundation.color.border.semantic.negative.default
Value: #EA3829
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-default)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.default
kda.foundation.color.border.semantic.negative.inverse.@focus
Value: #FFB7A9
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-inverse-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.inverse.@focus
kda.foundation.color.border.semantic.negative.inverse.@hover
Value: #FF9B88
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-inverse-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.inverse.@hover
kda.foundation.color.border.semantic.negative.inverse.default
Value: #FF7C65
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-inverse-default)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.inverse.default
☀️ light
🌙 dark
kda.foundation.color.border.semantic.negative.subtle
Value: #FFB7A9
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-negative-subtle)
JavaScript: tokens.kda.foundation.color.border.semantic.negative.subtle
kda.foundation.color.border.semantic.positive.@disabled
Value: #72e06a
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-@disabled)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.@disabled
kda.foundation.color.border.semantic.positive.@focus
Value: #009112
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.@focus
kda.foundation.color.border.semantic.positive.@hover
Value: #007c0f
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.@hover
kda.foundation.color.border.semantic.positive.default
Value: #009112
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-default)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.default
kda.foundation.color.border.semantic.positive.inverse.@focus
Value: #72e06a
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-inverse-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.inverse.@focus
kda.foundation.color.border.semantic.positive.inverse.@hover
Value: #4ecf50
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-inverse-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.inverse.@hover
kda.foundation.color.border.semantic.positive.inverse.default
Value: #27bb36
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-inverse-default)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.inverse.default
☀️ light
🌙 dark
kda.foundation.color.border.semantic.positive.subtle
Value: #72e06a
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-positive-subtle)
JavaScript: tokens.kda.foundation.color.border.semantic.positive.subtle
kda.foundation.color.border.semantic.warning.@disabled
Value: #E8C600
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-@disabled)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.@disabled
kda.foundation.color.border.semantic.warning.@focus
Value: #9B7800
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.@focus
kda.foundation.color.border.semantic.warning.@hover
Value: #856600
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.@hover
kda.foundation.color.border.semantic.warning.default
Value: #9B7800
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-default)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.default
kda.foundation.color.border.semantic.warning.inverse.@focus
Value: #E8C600
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-inverse-@focus)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.inverse.@focus
kda.foundation.color.border.semantic.warning.inverse.@hover
Value: #D7B300
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-inverse-@hover)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.inverse.@hover
kda.foundation.color.border.semantic.warning.inverse.default
Value: #C49F00
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-inverse-default)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.inverse.default
☀️ light
🌙 dark
kda.foundation.color.border.semantic.warning.subtle
Value: #E8C600
Usage Examples
CSS Variable: var(--kda-foundation-color-border-semantic-warning-subtle)
JavaScript: tokens.kda.foundation.color.border.semantic.warning.subtle
☀️ light
🌙 dark
kda.foundation.color.border.tint.@focus
Value: #27795ecc
Usage Examples
CSS Variable: var(--kda-foundation-color-border-tint-@focus)
JavaScript: tokens.kda.foundation.color.border.tint.@focus
kda.foundation.color.border.tint.outline
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-border-tint-outline)
JavaScript: tokens.kda.foundation.color.border.tint.outline
kda.foundation.color.brand.key.accent
Value: #E41968
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-key-accent)
JavaScript: tokens.kda.foundation.color.brand.key.accent
☀️ light
🌙 dark
kda.foundation.color.brand.key.black
Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-key-black)
JavaScript: tokens.kda.foundation.color.brand.key.black
kda.foundation.color.brand.key.neutralwarm
Value: #F0EAE6
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-key-neutralwarm)
JavaScript: tokens.kda.foundation.color.brand.key.neutralwarm
kda.foundation.color.brand.key.primary
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-key-primary)
JavaScript: tokens.kda.foundation.color.brand.key.primary
☀️ light
🌙 dark
kda.foundation.color.brand.key.secondary
Value: #0B1D2E
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-key-secondary)
JavaScript: tokens.kda.foundation.color.brand.key.secondary
kda.foundation.color.brand.key.tertiary
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-key-tertiary)
JavaScript: tokens.kda.foundation.color.brand.key.tertiary
☀️ light
🌙 dark
kda.foundation.color.brand.key.white
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-key-white)
JavaScript: tokens.kda.foundation.color.brand.key.white
kda.foundation.color.brand.primary.n0
Value: #E9F8EF
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n0)
JavaScript: tokens.kda.foundation.color.brand.primary.n0
kda.foundation.color.brand.primary.n1
Value: #CEF8E0
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n1)
JavaScript: tokens.kda.foundation.color.brand.primary.n1
kda.foundation.color.brand.primary.n10
Value: #A2D5BE
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n10)
JavaScript: tokens.kda.foundation.color.brand.primary.n10
kda.foundation.color.brand.primary.n100
Value: #061A10
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n100)
JavaScript: tokens.kda.foundation.color.brand.primary.n100
kda.foundation.color.brand.primary.n20
Value: #8CC4AD
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n20)
JavaScript: tokens.kda.foundation.color.brand.primary.n20
kda.foundation.color.brand.primary.n30
Value: #76B39B
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n30)
JavaScript: tokens.kda.foundation.color.brand.primary.n30
kda.foundation.color.brand.primary.n40
Value: #60A18A
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n40)
JavaScript: tokens.kda.foundation.color.brand.primary.n40
kda.foundation.color.brand.primary.n5
Value: #B8E7CF
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n5)
JavaScript: tokens.kda.foundation.color.brand.primary.n5
kda.foundation.color.brand.primary.n50
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n50)
JavaScript: tokens.kda.foundation.color.brand.primary.n50
kda.foundation.color.brand.primary.n60
Value: #3F806A
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n60)
JavaScript: tokens.kda.foundation.color.brand.primary.n60
kda.foundation.color.brand.primary.n70
Value: #356F5A
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n70)
JavaScript: tokens.kda.foundation.color.brand.primary.n70
kda.foundation.color.brand.primary.n80
Value: #2A5F4B
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n80)
JavaScript: tokens.kda.foundation.color.brand.primary.n80
kda.foundation.color.brand.primary.n90
Value: #1F4F3C
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n90)
JavaScript: tokens.kda.foundation.color.brand.primary.n90
kda.foundation.color.brand.primary.n95
Value: #153E2C
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n95)
JavaScript: tokens.kda.foundation.color.brand.primary.n95
kda.foundation.color.brand.primary.n99
Value: #0A2E1D
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-primary-n99)
JavaScript: tokens.kda.foundation.color.brand.primary.n99
kda.foundation.color.brand.secondary.n0
Value: #F0F8FF
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n0)
JavaScript: tokens.kda.foundation.color.brand.secondary.n0
kda.foundation.color.brand.secondary.n1
Value: #D6EBFF
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n1)
JavaScript: tokens.kda.foundation.color.brand.secondary.n1
kda.foundation.color.brand.secondary.n10
Value: #A0CBF4
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n10)
JavaScript: tokens.kda.foundation.color.brand.secondary.n10
kda.foundation.color.brand.secondary.n100
Value: #06101A
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n100)
JavaScript: tokens.kda.foundation.color.brand.secondary.n100
kda.foundation.color.brand.secondary.n20
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n20)
JavaScript: tokens.kda.foundation.color.brand.secondary.n20
kda.foundation.color.brand.secondary.n30
Value: #6BACE8
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n30)
JavaScript: tokens.kda.foundation.color.brand.secondary.n30
kda.foundation.color.brand.secondary.n40
Value: #509CE3
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n40)
JavaScript: tokens.kda.foundation.color.brand.secondary.n40
kda.foundation.color.brand.secondary.n5
Value: #BBDBF9
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n5)
JavaScript: tokens.kda.foundation.color.brand.secondary.n5
kda.foundation.color.brand.secondary.n50
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n50)
JavaScript: tokens.kda.foundation.color.brand.secondary.n50
kda.foundation.color.brand.secondary.n60
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n60)
JavaScript: tokens.kda.foundation.color.brand.secondary.n60
kda.foundation.color.brand.secondary.n70
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n70)
JavaScript: tokens.kda.foundation.color.brand.secondary.n70
kda.foundation.color.brand.secondary.n80
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n80)
JavaScript: tokens.kda.foundation.color.brand.secondary.n80
kda.foundation.color.brand.secondary.n90
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n90)
JavaScript: tokens.kda.foundation.color.brand.secondary.n90
kda.foundation.color.brand.secondary.n95
Value: #112C46
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n95)
JavaScript: tokens.kda.foundation.color.brand.secondary.n95
kda.foundation.color.brand.secondary.n99
Value: #0B1D2E
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-secondary-n99)
JavaScript: tokens.kda.foundation.color.brand.secondary.n99
kda.foundation.color.brand.tertiary.n0
Value: #FFF7EB
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n0)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n0
kda.foundation.color.brand.tertiary.n1
Value: #FFECCC
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n1)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n1
kda.foundation.color.brand.tertiary.n10
Value: #FDD291
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n10)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n10
kda.foundation.color.brand.tertiary.n100
Value: #290E01
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n100)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n100
kda.foundation.color.brand.tertiary.n20
Value: #FFBB63
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n20)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n20
kda.foundation.color.brand.tertiary.n30
Value: #F5A655
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n30)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n30
kda.foundation.color.brand.tertiary.n40
Value: #EC9046
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n40)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n40
kda.foundation.color.brand.tertiary.n5
Value: #FFDFAD
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n5)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n5
kda.foundation.color.brand.tertiary.n50
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n50)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n50
kda.foundation.color.brand.tertiary.n60
Value: #CB5D00
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n60)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n60
kda.foundation.color.brand.tertiary.n70
Value: #B14C00
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n70)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n70
kda.foundation.color.brand.tertiary.n80
Value: #953D00
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n80)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n80
kda.foundation.color.brand.tertiary.n90
Value: #7A2F00
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n90)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n90
kda.foundation.color.brand.tertiary.n95
Value: #612300
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n95)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n95
kda.foundation.color.brand.tertiary.n99
Value: #491901
Usage Examples
CSS Variable: var(--kda-foundation-color-brand-tertiary-n99)
JavaScript: tokens.kda.foundation.color.brand.tertiary.n99
☀️ light
🌙 dark
kda.foundation.color.categorical.category1.@hover

Visualisation Color 1 Hover State

Value: #227D9B
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category1-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category1.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category1.default

Visualisation Color 1

Value: #2898BD
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category1-default)
JavaScript: tokens.kda.foundation.color.categorical.category1.default
☀️ light
🌙 dark
kda.foundation.color.categorical.category2.@hover

Visualisation Color 2 Hover State

Value: #352C63
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category2-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category2.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category2.default

Visualisation Color 2

Value: #5E4DB2
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category2-default)
JavaScript: tokens.kda.foundation.color.categorical.category2.default
☀️ light
🌙 dark
kda.foundation.color.categorical.category3.@hover

Visualisation Color 3 Hover State

Value: #C25100
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category3-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category3.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category3.default

Visualisation Color 3

Value: #E56910
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category3-default)
JavaScript: tokens.kda.foundation.color.categorical.category3.default
☀️ light
🌙 dark
kda.foundation.color.categorical.category4.@hover

Visualisation Color 4 Hover State

Value: #50253F
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category4-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category4.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category4.default

Visualisation Color 4

Value: #943D73
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category4-default)
JavaScript: tokens.kda.foundation.color.categorical.category4.default
☀️ light
🌙 dark
kda.foundation.color.categorical.category5.@hover

Visualisation Color 5 Hover State

Value: #1C2B41
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category5-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category5.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category5.default

Visualisation Color 5

Value: #09326C
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category5-default)
JavaScript: tokens.kda.foundation.color.categorical.category5.default
☀️ light
🌙 dark
kda.foundation.color.categorical.category6.@hover

Visualisation Color 6 Hover State

Value: #8270DB
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category6-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category6.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category6.default

Visualisation Color 6

Value: #8F7EE7
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category6-default)
JavaScript: tokens.kda.foundation.color.categorical.category6.default
☀️ light
🌙 dark
kda.foundation.color.categorical.category7.@hover

Visualisation Color 7 Hover State

Value: #3D2232
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category7-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category7.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category7.default

Visualisation Color 7

Value: #50253F
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category7-default)
JavaScript: tokens.kda.foundation.color.categorical.category7.default
☀️ light
🌙 dark
kda.foundation.color.categorical.category8.@hover

Visualisation Color 8 Hover State

Value: #702E00
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category8-@hover)
JavaScript: tokens.kda.foundation.color.categorical.category8.@hover
☀️ light
🌙 dark
kda.foundation.color.categorical.category8.default

Visualisation Color 8

Value: #A54800
Usage Examples
CSS Variable: var(--kda-foundation-color-categorical-category8-default)
JavaScript: tokens.kda.foundation.color.categorical.category8.default
kda.foundation.color.icon.base.@active
Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-@active)
JavaScript: tokens.kda.foundation.color.icon.base.@active
kda.foundation.color.icon.base.@disabled
Value: #00000033
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-@disabled)
JavaScript: tokens.kda.foundation.color.icon.base.@disabled
kda.foundation.color.icon.base.@focus
Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-@focus)
JavaScript: tokens.kda.foundation.color.icon.base.@focus
kda.foundation.color.icon.base.@hover
Value: #020e1b80
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-@hover)
JavaScript: tokens.kda.foundation.color.icon.base.@hover
kda.foundation.color.icon.base.@init
Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-@init)
JavaScript: tokens.kda.foundation.color.icon.base.@init
kda.foundation.color.icon.base.bold
Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-bold)
JavaScript: tokens.kda.foundation.color.icon.base.bold
kda.foundation.color.icon.base.default
Value: #131E2B
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-default)
JavaScript: tokens.kda.foundation.color.icon.base.default
kda.foundation.color.icon.base.inverse.@active
Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-inverse-@active)
JavaScript: tokens.kda.foundation.color.icon.base.inverse.@active
kda.foundation.color.icon.base.inverse.@disabled
Value: #ffffff33
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.icon.base.inverse.@disabled
kda.foundation.color.icon.base.inverse.@focus
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-inverse-@focus)
JavaScript: tokens.kda.foundation.color.icon.base.inverse.@focus
kda.foundation.color.icon.base.inverse.@hover
Value: #f5f5f580
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-inverse-@hover)
JavaScript: tokens.kda.foundation.color.icon.base.inverse.@hover
kda.foundation.color.icon.base.inverse.@init
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-inverse-@init)
JavaScript: tokens.kda.foundation.color.icon.base.inverse.@init
kda.foundation.color.icon.base.inverse.bold
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-inverse-bold)
JavaScript: tokens.kda.foundation.color.icon.base.inverse.bold
kda.foundation.color.icon.base.inverse.default
Value: #E4E5E5
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-base-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.base.inverse.default
kda.foundation.color.icon.brand.logo.default
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-logo-default)
JavaScript: tokens.kda.foundation.color.icon.brand.logo.default
☀️ light
🌙 dark
kda.foundation.color.icon.brand.logo.inverse.default
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-logo-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.brand.logo.inverse.default
kda.foundation.color.icon.brand.primary.@active
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-@active)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.@active
kda.foundation.color.icon.brand.primary.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-@disabled)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.@disabled
kda.foundation.color.icon.brand.primary.@focus
Value: #3F806A
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-@focus)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.@focus
kda.foundation.color.icon.brand.primary.@hover
Value: #356F5A
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-@hover)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.@hover
kda.foundation.color.icon.brand.primary.bold
Value: #1F4F3C
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-bold)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.bold
kda.foundation.color.icon.brand.primary.default
Value: #2A5F4B
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-default)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.default
kda.foundation.color.icon.brand.primary.inverse.@active
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-inverse-@active)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.inverse.@active
kda.foundation.color.icon.brand.primary.inverse.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.inverse.@disabled
kda.foundation.color.icon.brand.primary.inverse.@focus
Value: #60A18A
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.inverse.@focus
kda.foundation.color.icon.brand.primary.inverse.@hover
Value: #76B39B
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.inverse.@hover
kda.foundation.color.icon.brand.primary.inverse.default
Value: #8CC4AD
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-primary-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.brand.primary.inverse.default
kda.foundation.color.icon.brand.secondary.@active
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-@active)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.@active
kda.foundation.color.icon.brand.secondary.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-@disabled)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.@disabled
kda.foundation.color.icon.brand.secondary.@focus
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-@focus)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.@focus
kda.foundation.color.icon.brand.secondary.@hover
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-@hover)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.@hover
kda.foundation.color.icon.brand.secondary.bold
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-bold)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.bold
kda.foundation.color.icon.brand.secondary.default
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-default)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.default
kda.foundation.color.icon.brand.secondary.inverse.@active
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-inverse-@active)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.inverse.@active
kda.foundation.color.icon.brand.secondary.inverse.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.inverse.@disabled
kda.foundation.color.icon.brand.secondary.inverse.@focus
Value: #509CE3
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.inverse.@focus
kda.foundation.color.icon.brand.secondary.inverse.@hover
Value: #6BACE8
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.inverse.@hover
kda.foundation.color.icon.brand.secondary.inverse.default
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-brand-secondary-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.brand.secondary.inverse.default
☀️ light
🌙 dark
kda.foundation.color.icon.product.spirekey.animation.end
Value: #4BE9B5
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-product-spirekey-animation-end)
JavaScript: tokens.kda.foundation.color.icon.product.spirekey.animation.end
kda.foundation.color.icon.product.spirekey.animation.start
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-product-spirekey-animation-start)
JavaScript: tokens.kda.foundation.color.icon.product.spirekey.animation.start
kda.foundation.color.icon.product.spirekey.animation.step1
Value: #4AA688
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-product-spirekey-animation-step1)
JavaScript: tokens.kda.foundation.color.icon.product.spirekey.animation.step1
kda.foundation.color.icon.product.spirekey.animation.step2
Value: #4BBD97
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-product-spirekey-animation-step2)
JavaScript: tokens.kda.foundation.color.icon.product.spirekey.animation.step2
kda.foundation.color.icon.product.spirekey.animation.step3
Value: #4BD3A6
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-product-spirekey-animation-step3)
JavaScript: tokens.kda.foundation.color.icon.product.spirekey.animation.step3
kda.foundation.color.icon.semantic.info.@active
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.@active
kda.foundation.color.icon.semantic.info.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.@disabled
kda.foundation.color.icon.semantic.info.@focus
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.@focus
kda.foundation.color.icon.semantic.info.@hover
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.@hover
kda.foundation.color.icon.semantic.info.default
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.default
kda.foundation.color.icon.semantic.info.inverse.@active
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-inverse-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.inverse.@active
kda.foundation.color.icon.semantic.info.inverse.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.inverse.@disabled
kda.foundation.color.icon.semantic.info.inverse.@focus
Value: #509CE3
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-inverse-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.inverse.@focus
kda.foundation.color.icon.semantic.info.inverse.@hover
Value: #6BACE8
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-inverse-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.inverse.@hover
kda.foundation.color.icon.semantic.info.inverse.default
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-info-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.info.inverse.default
kda.foundation.color.icon.semantic.negative.@active
Value: #F75C46
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.@active
kda.foundation.color.icon.semantic.negative.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.@disabled
kda.foundation.color.icon.semantic.negative.@focus
Value: #EA3829
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.@focus
kda.foundation.color.icon.semantic.negative.@hover
Value: #D31510
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.@hover
kda.foundation.color.icon.semantic.negative.default
Value: #B40000
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.default
kda.foundation.color.icon.semantic.negative.inverse.@active
Value: #F75C46
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-inverse-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.inverse.@active
kda.foundation.color.icon.semantic.negative.inverse.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.inverse.@disabled
kda.foundation.color.icon.semantic.negative.inverse.@focus
Value: #FF7C65
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-inverse-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.inverse.@focus
kda.foundation.color.icon.semantic.negative.inverse.@hover
Value: #FF9B88
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-inverse-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.inverse.@hover
kda.foundation.color.icon.semantic.negative.inverse.default
Value: #FFB7A9
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-negative-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.negative.inverse.default
kda.foundation.color.icon.semantic.positive.@active
Value: #07a721
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.@active
kda.foundation.color.icon.semantic.positive.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.@disabled
kda.foundation.color.icon.semantic.positive.@focus
Value: #009112
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.@focus
kda.foundation.color.icon.semantic.positive.@hover
Value: #007c0f
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.@hover
kda.foundation.color.icon.semantic.positive.default
Value: #00670f
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.default
kda.foundation.color.icon.semantic.positive.inverse.@active
Value: #07a721
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-inverse-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.inverse.@active
kda.foundation.color.icon.semantic.positive.inverse.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.inverse.@disabled
kda.foundation.color.icon.semantic.positive.inverse.@focus
Value: #27bb36
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-inverse-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.inverse.@focus
kda.foundation.color.icon.semantic.positive.inverse.@hover
Value: #4ecf50
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-inverse-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.inverse.@hover
kda.foundation.color.icon.semantic.positive.inverse.default
Value: #72e06a
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-positive-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.positive.inverse.default
kda.foundation.color.icon.semantic.warning.@active
Value: #B08C00
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.@active
kda.foundation.color.icon.semantic.warning.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.@disabled
kda.foundation.color.icon.semantic.warning.@focus
Value: #9B7800
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.@focus
kda.foundation.color.icon.semantic.warning.@hover
Value: #856600
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.@hover
kda.foundation.color.icon.semantic.warning.default
Value: #705300
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.default
kda.foundation.color.icon.semantic.warning.inverse.@active
Value: #B08C00
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-inverse-@active)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.inverse.@active
kda.foundation.color.icon.semantic.warning.inverse.@disabled
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.inverse.@disabled
kda.foundation.color.icon.semantic.warning.inverse.@focus
Value: #C49F00
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-inverse-@focus)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.inverse.@focus
kda.foundation.color.icon.semantic.warning.inverse.@hover
Value: #D7B300
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-inverse-@hover)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.inverse.@hover
kda.foundation.color.icon.semantic.warning.inverse.default
Value: #E8C600
Usage Examples
CSS Variable: var(--kda-foundation-color-icon-semantic-warning-inverse-default)
JavaScript: tokens.kda.foundation.color.icon.semantic.warning.inverse.default
☀️ light
🌙 dark
kda.foundation.color.link.base.@focus
Value: #0A1F18
Usage Examples
CSS Variable: var(--kda-foundation-color-link-base-@focus)
JavaScript: tokens.kda.foundation.color.link.base.@focus
☀️ light
🌙 dark
kda.foundation.color.link.base.@hover
Value: #0A1F18
Usage Examples
CSS Variable: var(--kda-foundation-color-link-base-@hover)
JavaScript: tokens.kda.foundation.color.link.base.@hover
☀️ light
🌙 dark
kda.foundation.color.link.base.@visited
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-base-@visited)
JavaScript: tokens.kda.foundation.color.link.base.@visited
☀️ light
🌙 dark
kda.foundation.color.link.base.default
Value: #20624C
Usage Examples
CSS Variable: var(--kda-foundation-color-link-base-default)
JavaScript: tokens.kda.foundation.color.link.base.default
kda.foundation.color.link.brand.primary.@focus
Value: #3F806A
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-primary-@focus)
JavaScript: tokens.kda.foundation.color.link.brand.primary.@focus
kda.foundation.color.link.brand.primary.@hover
Value: #2A5F4B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-primary-@hover)
JavaScript: tokens.kda.foundation.color.link.brand.primary.@hover
kda.foundation.color.link.brand.primary.@visited
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-primary-@visited)
JavaScript: tokens.kda.foundation.color.link.brand.primary.@visited
kda.foundation.color.link.brand.primary.default
Value: #356F5A
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-primary-default)
JavaScript: tokens.kda.foundation.color.link.brand.primary.default
kda.foundation.color.link.brand.secondary.@focus
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-secondary-@focus)
JavaScript: tokens.kda.foundation.color.link.brand.secondary.@focus
kda.foundation.color.link.brand.secondary.@hover
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-secondary-@hover)
JavaScript: tokens.kda.foundation.color.link.brand.secondary.@hover
kda.foundation.color.link.brand.secondary.@visited
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-secondary-@visited)
JavaScript: tokens.kda.foundation.color.link.brand.secondary.@visited
kda.foundation.color.link.brand.secondary.default
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-link-brand-secondary-default)
JavaScript: tokens.kda.foundation.color.link.brand.secondary.default
kda.foundation.color.link.semantic.info.@focus
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-info-@focus)
JavaScript: tokens.kda.foundation.color.link.semantic.info.@focus
kda.foundation.color.link.semantic.info.@hover
Value: #112C46
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-info-@hover)
JavaScript: tokens.kda.foundation.color.link.semantic.info.@hover
kda.foundation.color.link.semantic.info.@visited
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-info-@visited)
JavaScript: tokens.kda.foundation.color.link.semantic.info.@visited
kda.foundation.color.link.semantic.info.default
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-info-default)
JavaScript: tokens.kda.foundation.color.link.semantic.info.default
kda.foundation.color.link.semantic.negative.@focus
Value: #B40000
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-negative-@focus)
JavaScript: tokens.kda.foundation.color.link.semantic.negative.@focus
kda.foundation.color.link.semantic.negative.@hover
Value: #740000
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-negative-@hover)
JavaScript: tokens.kda.foundation.color.link.semantic.negative.@hover
kda.foundation.color.link.semantic.negative.@visited
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-negative-@visited)
JavaScript: tokens.kda.foundation.color.link.semantic.negative.@visited
kda.foundation.color.link.semantic.negative.default
Value: #930000
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-negative-default)
JavaScript: tokens.kda.foundation.color.link.semantic.negative.default
kda.foundation.color.link.semantic.positive.@focus
Value: #00670f
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-positive-@focus)
JavaScript: tokens.kda.foundation.color.link.semantic.positive.@focus
kda.foundation.color.link.semantic.positive.@hover
Value: #00400a
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-positive-@hover)
JavaScript: tokens.kda.foundation.color.link.semantic.positive.@hover
kda.foundation.color.link.semantic.positive.@visited
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-positive-@visited)
JavaScript: tokens.kda.foundation.color.link.semantic.positive.@visited
kda.foundation.color.link.semantic.positive.default
Value: #00530d
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-positive-default)
JavaScript: tokens.kda.foundation.color.link.semantic.positive.default
kda.foundation.color.link.semantic.warning.@focus
Value: #705300
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-warning-@focus)
JavaScript: tokens.kda.foundation.color.link.semantic.warning.@focus
kda.foundation.color.link.semantic.warning.@hover
Value: #483300
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-warning-@hover)
JavaScript: tokens.kda.foundation.color.link.semantic.warning.@hover
kda.foundation.color.link.semantic.warning.@visited
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-warning-@visited)
JavaScript: tokens.kda.foundation.color.link.semantic.warning.@visited
kda.foundation.color.link.semantic.warning.default
Value: #5B4300
Usage Examples
CSS Variable: var(--kda-foundation-color-link-semantic-warning-default)
JavaScript: tokens.kda.foundation.color.link.semantic.warning.default
☀️ light
🌙 dark
kda.foundation.color.neutral.n0
Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0)
JavaScript: tokens.kda.foundation.color.neutral.n0
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha0

Generated from kda.foundation.color.neutral.n0 with alpha(0)

Value: #ffffff00
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha0)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha0
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha10

Generated from kda.foundation.color.neutral.n0 with alpha(10)

Value: #ffffff1a
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha10)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha10
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha20

Generated from kda.foundation.color.neutral.n0 with alpha(20)

Value: #ffffff33
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha20)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha20
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha40

Generated from kda.foundation.color.neutral.n0 with alpha(40)

Value: #ffffff66
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha40)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha40
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha70

Generated from kda.foundation.color.neutral.n0 with alpha(70)

Value: #ffffffb3
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha70)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha70
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha80

Generated from kda.foundation.color.neutral.n0 with alpha(80)

Value: #ffffffcc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha90

Generated from kda.foundation.color.neutral.n0 with alpha(90)

Value: #ffffffe6
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha90)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha90
☀️ light
🌙 dark
kda.foundation.color.neutral.n0@alpha95

Generated from kda.foundation.color.neutral.n0 with alpha(95)

Value: #fffffff2
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n0@alpha95)
JavaScript: tokens.kda.foundation.color.neutral.n0@alpha95
☀️ light
🌙 dark
kda.foundation.color.neutral.n1
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1)
JavaScript: tokens.kda.foundation.color.neutral.n1
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha0

Generated from kda.foundation.color.neutral.n1 with alpha(0)

Value: #f5f5f500
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha0)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha0
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha1

Generated from kda.foundation.color.neutral.n1 with alpha(1)

Value: #f5f5f503
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha1)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha1
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha10

Generated from kda.foundation.color.neutral.n1 with alpha(10)

Value: #f5f5f51a
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha10)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha10
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha20

Generated from kda.foundation.color.neutral.n1 with alpha(20)

Value: #f5f5f533
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha20)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha20
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha3

Generated from kda.foundation.color.neutral.n1 with alpha(3)

Value: #f5f5f508
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha3)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha3
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha30

Generated from kda.foundation.color.neutral.n1 with alpha(30)

Value: #f5f5f54d
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha30)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha30
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha4

Generated from kda.foundation.color.neutral.n1 with alpha(4)

Value: #f5f5f50a
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha4)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha4
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha40

Generated from kda.foundation.color.neutral.n1 with alpha(40)

Value: #f5f5f566
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha40)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha40
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha5

Generated from kda.foundation.color.neutral.n1 with alpha(5)

Value: #f5f5f50d
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha5)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha5
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha50

Generated from kda.foundation.color.neutral.n1 with alpha(50)

Value: #f5f5f580
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha50)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha50
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha6

Generated from kda.foundation.color.neutral.n1 with alpha(6)

Value: #f5f5f50f
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha6)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha6
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha80

Generated from kda.foundation.color.neutral.n1 with alpha(80)

Value: #f5f5f5cc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n1@alpha90

Generated from kda.foundation.color.neutral.n1 with alpha(90)

Value: #f5f5f5e6
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n1@alpha90)
JavaScript: tokens.kda.foundation.color.neutral.n1@alpha90
☀️ light
🌙 dark
kda.foundation.color.neutral.n10
Value: #D2D4D6
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n10)
JavaScript: tokens.kda.foundation.color.neutral.n10
☀️ light
🌙 dark
kda.foundation.color.neutral.n10@alpha80

Generated from kda.foundation.color.neutral.n10 with alpha(80)

Value: #d2d4d6cc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n10@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n10@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n100
Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100)
JavaScript: tokens.kda.foundation.color.neutral.n100
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha0

Generated from kda.foundation.color.neutral.n100 with alpha(0)

Value: #00000000
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha0)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha0
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha10

Generated from kda.foundation.color.neutral.n100 with alpha(10)

Value: #0000001a
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha10)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha10
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha20

Generated from kda.foundation.color.neutral.n100 with alpha(20)

Value: #00000033
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha20)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha20
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha40

Generated from kda.foundation.color.neutral.n100 with alpha(40)

Value: #00000066
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha40)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha40
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha70

Generated from kda.foundation.color.neutral.n100 with alpha(70)

Value: #000000b3
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha70)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha70
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha80

Generated from kda.foundation.color.neutral.n100 with alpha(80)

Value: #000000cc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha90

Generated from kda.foundation.color.neutral.n100 with alpha(90)

Value: #000000e6
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha90)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha90
☀️ light
🌙 dark
kda.foundation.color.neutral.n100@alpha95

Generated from kda.foundation.color.neutral.n100 with alpha(95)

Value: #000000f2
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n100@alpha95)
JavaScript: tokens.kda.foundation.color.neutral.n100@alpha95
☀️ light
🌙 dark
kda.foundation.color.neutral.n15
Value: #C1C4C6
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n15)
JavaScript: tokens.kda.foundation.color.neutral.n15
☀️ light
🌙 dark
kda.foundation.color.neutral.n20
Value: #B0B3B7
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n20)
JavaScript: tokens.kda.foundation.color.neutral.n20
☀️ light
🌙 dark
kda.foundation.color.neutral.n20@alpha80

Generated from kda.foundation.color.neutral.n20 with alpha(80)

Value: #b0b3b7cc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n20@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n20@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n30
Value: #9EA3A7
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n30)
JavaScript: tokens.kda.foundation.color.neutral.n30
☀️ light
🌙 dark
kda.foundation.color.neutral.n40
Value: #8D9298
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n40)
JavaScript: tokens.kda.foundation.color.neutral.n40
☀️ light
🌙 dark
kda.foundation.color.neutral.n5
Value: #E4E5E5
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n5)
JavaScript: tokens.kda.foundation.color.neutral.n5
☀️ light
🌙 dark
kda.foundation.color.neutral.n5@alpha80

Generated from kda.foundation.color.neutral.n5 with alpha(80)

Value: #e4e5e5cc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n5@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n5@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n5@alpha95

Generated from kda.foundation.color.neutral.n5 with alpha(95)

Value: #e4e5e5f2
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n5@alpha95)
JavaScript: tokens.kda.foundation.color.neutral.n5@alpha95
☀️ light
🌙 dark
kda.foundation.color.neutral.n50
Value: #7C8288
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n50)
JavaScript: tokens.kda.foundation.color.neutral.n50
☀️ light
🌙 dark
kda.foundation.color.neutral.n60
Value: #6A7178
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n60)
JavaScript: tokens.kda.foundation.color.neutral.n60
☀️ light
🌙 dark
kda.foundation.color.neutral.n70
Value: #596069
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n70)
JavaScript: tokens.kda.foundation.color.neutral.n70
☀️ light
🌙 dark
kda.foundation.color.neutral.n80
Value: #475059
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n80)
JavaScript: tokens.kda.foundation.color.neutral.n80
☀️ light
🌙 dark
kda.foundation.color.neutral.n80@alpha80

Generated from kda.foundation.color.neutral.n80 with alpha(80)

Value: #475059cc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n80@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n80@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n85
Value: #36404A
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n85)
JavaScript: tokens.kda.foundation.color.neutral.n85
☀️ light
🌙 dark
kda.foundation.color.neutral.n90
Value: #252F3A
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n90)
JavaScript: tokens.kda.foundation.color.neutral.n90
☀️ light
🌙 dark
kda.foundation.color.neutral.n90@alpha20

Generated from kda.foundation.color.neutral.n90 with alpha(20)

Value: #252f3a33
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n90@alpha20)
JavaScript: tokens.kda.foundation.color.neutral.n90@alpha20
☀️ light
🌙 dark
kda.foundation.color.neutral.n90@alpha25

Generated from kda.foundation.color.neutral.n90 with alpha(25)

Value: #252f3a40
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n90@alpha25)
JavaScript: tokens.kda.foundation.color.neutral.n90@alpha25
☀️ light
🌙 dark
kda.foundation.color.neutral.n95
Value: #131E2B
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n95)
JavaScript: tokens.kda.foundation.color.neutral.n95
☀️ light
🌙 dark
kda.foundation.color.neutral.n95@alpha80

Generated from kda.foundation.color.neutral.n95 with alpha(80)

Value: #131e2bcc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n95@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n95@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n95@alpha95

Generated from kda.foundation.color.neutral.n95 with alpha(95)

Value: #131e2bf2
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n95@alpha95)
JavaScript: tokens.kda.foundation.color.neutral.n95@alpha95
☀️ light
🌙 dark
kda.foundation.color.neutral.n99
Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99)
JavaScript: tokens.kda.foundation.color.neutral.n99
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha0

Generated from kda.foundation.color.neutral.n99 with alpha(0)

Value: #020e1b00
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha0)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha0
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha1

Generated from kda.foundation.color.neutral.n99 with alpha(1)

Value: #020e1b03
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha1)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha1
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha10

Generated from kda.foundation.color.neutral.n99 with alpha(10)

Value: #020e1b1a
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha10)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha10
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha20

Generated from kda.foundation.color.neutral.n99 with alpha(20)

Value: #020e1b33
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha20)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha20
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha3

Generated from kda.foundation.color.neutral.n99 with alpha(3)

Value: #020e1b08
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha3)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha3
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha30

Generated from kda.foundation.color.neutral.n99 with alpha(30)

Value: #020e1b4d
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha30)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha30
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha4

Generated from kda.foundation.color.neutral.n99 with alpha(4)

Value: #020e1b0a
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha4)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha4
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha40

Generated from kda.foundation.color.neutral.n99 with alpha(40)

Value: #020e1b66
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha40)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha40
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha5

Generated from kda.foundation.color.neutral.n99 with alpha(5)

Value: #020e1b0d
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha5)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha5
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha50

Generated from kda.foundation.color.neutral.n99 with alpha(50)

Value: #020e1b80
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha50)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha50
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha6

Generated from kda.foundation.color.neutral.n99 with alpha(6)

Value: #020e1b0f
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha6)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha6
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha80

Generated from kda.foundation.color.neutral.n99 with alpha(80)

Value: #020e1bcc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha80)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutral.n99@alpha90

Generated from kda.foundation.color.neutral.n99 with alpha(90)

Value: #020e1be6
Usage Examples
CSS Variable: var(--kda-foundation-color-neutral-n99@alpha90)
JavaScript: tokens.kda.foundation.color.neutral.n99@alpha90
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n0
Value: #FBFAF9
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n0)
JavaScript: tokens.kda.foundation.color.neutralwarm.n0
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n1
Value: #F0EAE6
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n1)
JavaScript: tokens.kda.foundation.color.neutralwarm.n1
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n1@alpha30

Generated from kda.foundation.color.neutralwarm.n1 with alpha(30)

Value: #f0eae64d
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n1@alpha30)
JavaScript: tokens.kda.foundation.color.neutralwarm.n1@alpha30
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n1@alpha60

Generated from kda.foundation.color.neutralwarm.n1 with alpha(60)

Value: #f0eae699
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n1@alpha60)
JavaScript: tokens.kda.foundation.color.neutralwarm.n1@alpha60
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n1@alpha80

Generated from kda.foundation.color.neutralwarm.n1 with alpha(80)

Value: #f0eae6cc
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n1@alpha80)
JavaScript: tokens.kda.foundation.color.neutralwarm.n1@alpha80
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n1@alpha95

Generated from kda.foundation.color.neutralwarm.n1 with alpha(95)

Value: #f0eae6f2
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n1@alpha95)
JavaScript: tokens.kda.foundation.color.neutralwarm.n1@alpha95
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n10
Value: #CBC6C2
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n10)
JavaScript: tokens.kda.foundation.color.neutralwarm.n10
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n100
Value: #050505
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n100)
JavaScript: tokens.kda.foundation.color.neutralwarm.n100
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n20
Value: #B8B3B0
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n20)
JavaScript: tokens.kda.foundation.color.neutralwarm.n20
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n30
Value: #A5A19E
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n30)
JavaScript: tokens.kda.foundation.color.neutralwarm.n30
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n40
Value: #928F8C
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n40)
JavaScript: tokens.kda.foundation.color.neutralwarm.n40
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n5
Value: #DDD8D4
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n5)
JavaScript: tokens.kda.foundation.color.neutralwarm.n5
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n50
Value: #807D7B
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n50)
JavaScript: tokens.kda.foundation.color.neutralwarm.n50
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n60
Value: #6D6A69
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n60)
JavaScript: tokens.kda.foundation.color.neutralwarm.n60
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n70
Value: #5A5857
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n70)
JavaScript: tokens.kda.foundation.color.neutralwarm.n70
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n80
Value: #474645
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n80)
JavaScript: tokens.kda.foundation.color.neutralwarm.n80
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n90
Value: #353433
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n90)
JavaScript: tokens.kda.foundation.color.neutralwarm.n90
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n95
Value: #222121
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n95)
JavaScript: tokens.kda.foundation.color.neutralwarm.n95
☀️ light
🌙 dark
kda.foundation.color.neutralwarm.n99
Value: #0F0F0F
Usage Examples
CSS Variable: var(--kda-foundation-color-neutralwarm-n99)
JavaScript: tokens.kda.foundation.color.neutralwarm.n99
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n0
Value: #F0FFFA
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n0)
JavaScript: tokens.kda.foundation.color.palette.aqua.n0
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n1
Value: #C9FFED
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n1)
JavaScript: tokens.kda.foundation.color.palette.aqua.n1
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n10
Value: #7AFFD3
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n10)
JavaScript: tokens.kda.foundation.color.palette.aqua.n10
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n100
Value: #0A1F18
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n100)
JavaScript: tokens.kda.foundation.color.palette.aqua.n100
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n20
Value: #52FFC6
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n20)
JavaScript: tokens.kda.foundation.color.palette.aqua.n20
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n20@alpha80

Generated from kda.foundation.color.palette.aqua.n20 with alpha(80)

Value: #52ffc6cc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n20@alpha80)
JavaScript: tokens.kda.foundation.color.palette.aqua.n20@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n30
Value: #4BE9B5
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n30)
JavaScript: tokens.kda.foundation.color.palette.aqua.n30
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n40
Value: #44D2A3
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n40)
JavaScript: tokens.kda.foundation.color.palette.aqua.n40
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n5
Value: #A1FFE0
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n5)
JavaScript: tokens.kda.foundation.color.palette.aqua.n5
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n50
Value: #3CBC92
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n50)
JavaScript: tokens.kda.foundation.color.palette.aqua.n50
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n60
Value: #35A580
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n60)
JavaScript: tokens.kda.foundation.color.palette.aqua.n60
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n70
Value: #2E8F6F
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n70)
JavaScript: tokens.kda.foundation.color.palette.aqua.n70
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n80
Value: #27795E
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n80)
JavaScript: tokens.kda.foundation.color.palette.aqua.n80
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n80@alpha80

Generated from kda.foundation.color.palette.aqua.n80 with alpha(80)

Value: #27795ecc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n80@alpha80)
JavaScript: tokens.kda.foundation.color.palette.aqua.n80@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n90
Value: #20624C
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n90)
JavaScript: tokens.kda.foundation.color.palette.aqua.n90
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n95
Value: #184C3B
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n95)
JavaScript: tokens.kda.foundation.color.palette.aqua.n95
☀️ light
🌙 dark
kda.foundation.color.palette.aqua.n99
Value: #113529
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-aqua-n99)
JavaScript: tokens.kda.foundation.color.palette.aqua.n99
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n0
Value: #F0F8FF
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n0)
JavaScript: tokens.kda.foundation.color.palette.blue.n0
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n1
Value: #D6EBFF
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n1)
JavaScript: tokens.kda.foundation.color.palette.blue.n1
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n10
Value: #A0CBF4
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n10)
JavaScript: tokens.kda.foundation.color.palette.blue.n10
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n100
Value: #06101A
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n100)
JavaScript: tokens.kda.foundation.color.palette.blue.n100
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n20
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n20)
JavaScript: tokens.kda.foundation.color.palette.blue.n20
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n20@alpha20

Generated from kda.foundation.color.palette.blue.n20 with alpha(20)

Value: #86bcee33
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n20@alpha20)
JavaScript: tokens.kda.foundation.color.palette.blue.n20@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n20@alpha80

Generated from kda.foundation.color.palette.blue.n20 with alpha(80)

Value: #86bceecc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n20@alpha80)
JavaScript: tokens.kda.foundation.color.palette.blue.n20@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n30
Value: #6BACE8
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n30)
JavaScript: tokens.kda.foundation.color.palette.blue.n30
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n40
Value: #509CE3
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n40)
JavaScript: tokens.kda.foundation.color.palette.blue.n40
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n5
Value: #BBDBF9
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n5)
JavaScript: tokens.kda.foundation.color.palette.blue.n5
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n50
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n50)
JavaScript: tokens.kda.foundation.color.palette.blue.n50
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n60
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n60)
JavaScript: tokens.kda.foundation.color.palette.blue.n60
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n70
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n70)
JavaScript: tokens.kda.foundation.color.palette.blue.n70
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n80
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n80)
JavaScript: tokens.kda.foundation.color.palette.blue.n80
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n80@alpha20

Generated from kda.foundation.color.palette.blue.n80 with alpha(20)

Value: #20558633
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n80@alpha20)
JavaScript: tokens.kda.foundation.color.palette.blue.n80@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n80@alpha80

Generated from kda.foundation.color.palette.blue.n80 with alpha(80)

Value: #205586cc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n80@alpha80)
JavaScript: tokens.kda.foundation.color.palette.blue.n80@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n90
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n90)
JavaScript: tokens.kda.foundation.color.palette.blue.n90
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n95
Value: #112C46
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n95)
JavaScript: tokens.kda.foundation.color.palette.blue.n95
☀️ light
🌙 dark
kda.foundation.color.palette.blue.n99
Value: #0B1D2E
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-blue-n99)
JavaScript: tokens.kda.foundation.color.palette.blue.n99
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n0
Value: #E9FCE3
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n0)
JavaScript: tokens.kda.foundation.color.palette.celery.n0
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n1
Value: #cdfcbf
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n1)
JavaScript: tokens.kda.foundation.color.palette.celery.n1
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n10
Value: #96ee85
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n10)
JavaScript: tokens.kda.foundation.color.palette.celery.n10
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n100
Value: #001A04
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n100)
JavaScript: tokens.kda.foundation.color.palette.celery.n100
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n20
Value: #72e06a
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n20)
JavaScript: tokens.kda.foundation.color.palette.celery.n20
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n20@alpha20

Generated from kda.foundation.color.palette.celery.n20 with alpha(20)

Value: #72e06a33
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n20@alpha20)
JavaScript: tokens.kda.foundation.color.palette.celery.n20@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n20@alpha80

Generated from kda.foundation.color.palette.celery.n20 with alpha(80)

Value: #72e06acc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n20@alpha80)
JavaScript: tokens.kda.foundation.color.palette.celery.n20@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n30
Value: #4ecf50
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n30)
JavaScript: tokens.kda.foundation.color.palette.celery.n30
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n40
Value: #27bb36
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n40)
JavaScript: tokens.kda.foundation.color.palette.celery.n40
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n5
Value: #aef69d
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n5)
JavaScript: tokens.kda.foundation.color.palette.celery.n5
kda.foundation.color.palette.celery.n50
Value: #07a721
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n50)
JavaScript: tokens.kda.foundation.color.palette.celery.n50
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n60
Value: #009112
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n60)
JavaScript: tokens.kda.foundation.color.palette.celery.n60
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n70
Value: #007c0f
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n70)
JavaScript: tokens.kda.foundation.color.palette.celery.n70
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n80
Value: #00670f
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n80)
JavaScript: tokens.kda.foundation.color.palette.celery.n80
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n80@alpha20

Generated from kda.foundation.color.palette.celery.n80 with alpha(20)

Value: #00670f33
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n80@alpha20)
JavaScript: tokens.kda.foundation.color.palette.celery.n80@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n80@alpha80

Generated from kda.foundation.color.palette.celery.n80 with alpha(80)

Value: #00670fcc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n80@alpha80)
JavaScript: tokens.kda.foundation.color.palette.celery.n80@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n90
Value: #00530d
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n90)
JavaScript: tokens.kda.foundation.color.palette.celery.n90
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n95
Value: #00400a
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n95)
JavaScript: tokens.kda.foundation.color.palette.celery.n95
☀️ light
🌙 dark
kda.foundation.color.palette.celery.n99
Value: #003007
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-celery-n99)
JavaScript: tokens.kda.foundation.color.palette.celery.n99
☀️ light
🌙 dark
kda.foundation.color.palette.green.n0
Value: #E9F8EF
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n0)
JavaScript: tokens.kda.foundation.color.palette.green.n0
☀️ light
🌙 dark
kda.foundation.color.palette.green.n1
Value: #CEF8E0
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n1)
JavaScript: tokens.kda.foundation.color.palette.green.n1
☀️ light
🌙 dark
kda.foundation.color.palette.green.n10
Value: #A2D5BE
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n10)
JavaScript: tokens.kda.foundation.color.palette.green.n10
☀️ light
🌙 dark
kda.foundation.color.palette.green.n100
Value: #061A10
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n100)
JavaScript: tokens.kda.foundation.color.palette.green.n100
☀️ light
🌙 dark
kda.foundation.color.palette.green.n20
Value: #8CC4AD
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n20)
JavaScript: tokens.kda.foundation.color.palette.green.n20
☀️ light
🌙 dark
kda.foundation.color.palette.green.n30
Value: #76B39B
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n30)
JavaScript: tokens.kda.foundation.color.palette.green.n30
☀️ light
🌙 dark
kda.foundation.color.palette.green.n40
Value: #60A18A
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n40)
JavaScript: tokens.kda.foundation.color.palette.green.n40
☀️ light
🌙 dark
kda.foundation.color.palette.green.n5
Value: #B8E7CF
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n5)
JavaScript: tokens.kda.foundation.color.palette.green.n5
☀️ light
🌙 dark
kda.foundation.color.palette.green.n50
Value: #4A9079
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n50)
JavaScript: tokens.kda.foundation.color.palette.green.n50
☀️ light
🌙 dark
kda.foundation.color.palette.green.n60
Value: #3F806A
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n60)
JavaScript: tokens.kda.foundation.color.palette.green.n60
☀️ light
🌙 dark
kda.foundation.color.palette.green.n70
Value: #356F5A
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n70)
JavaScript: tokens.kda.foundation.color.palette.green.n70
☀️ light
🌙 dark
kda.foundation.color.palette.green.n80
Value: #2A5F4B
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n80)
JavaScript: tokens.kda.foundation.color.palette.green.n80
☀️ light
🌙 dark
kda.foundation.color.palette.green.n90
Value: #1F4F3C
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n90)
JavaScript: tokens.kda.foundation.color.palette.green.n90
☀️ light
🌙 dark
kda.foundation.color.palette.green.n95
Value: #153E2C
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n95)
JavaScript: tokens.kda.foundation.color.palette.green.n95
☀️ light
🌙 dark
kda.foundation.color.palette.green.n99
Value: #0A2E1D
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-green-n99)
JavaScript: tokens.kda.foundation.color.palette.green.n99
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n0
Value: #FFF7FA
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n0)
JavaScript: tokens.kda.foundation.color.palette.magenta.n0
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n1
Value: #FFEAF1
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n1)
JavaScript: tokens.kda.foundation.color.palette.magenta.n1
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n10
Value: #F6A4C3
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n10)
JavaScript: tokens.kda.foundation.color.palette.magenta.n10
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n100
Value: #470820
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n100)
JavaScript: tokens.kda.foundation.color.palette.magenta.n100
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n20
Value: #F282AD
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n20)
JavaScript: tokens.kda.foundation.color.palette.magenta.n20
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n30
Value: #ED5F96
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n30)
JavaScript: tokens.kda.foundation.color.palette.magenta.n30
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n40
Value: #E93C7F
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n40)
JavaScript: tokens.kda.foundation.color.palette.magenta.n40
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n5
Value: #FBC7DA
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n5)
JavaScript: tokens.kda.foundation.color.palette.magenta.n5
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n50
Value: #E41968
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n50)
JavaScript: tokens.kda.foundation.color.palette.magenta.n50
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n60
Value: #CF175E
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n60)
JavaScript: tokens.kda.foundation.color.palette.magenta.n60
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n70
Value: #BA1455
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n70)
JavaScript: tokens.kda.foundation.color.palette.magenta.n70
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n80
Value: #A5124B
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n80)
JavaScript: tokens.kda.foundation.color.palette.magenta.n80
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n90
Value: #901041
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n90)
JavaScript: tokens.kda.foundation.color.palette.magenta.n90
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n95
Value: #7B0D38
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n95)
JavaScript: tokens.kda.foundation.color.palette.magenta.n95
☀️ light
🌙 dark
kda.foundation.color.palette.magenta.n99
Value: #660B2E
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-magenta-n99)
JavaScript: tokens.kda.foundation.color.palette.magenta.n99
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n0
Value: #FFF7EB
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n0)
JavaScript: tokens.kda.foundation.color.palette.orange.n0
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n1
Value: #FFECCC
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n1)
JavaScript: tokens.kda.foundation.color.palette.orange.n1
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n10
Value: #FDD291
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n10)
JavaScript: tokens.kda.foundation.color.palette.orange.n10
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n100
Value: #290E01
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n100)
JavaScript: tokens.kda.foundation.color.palette.orange.n100
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n20
Value: #FFBB63
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n20)
JavaScript: tokens.kda.foundation.color.palette.orange.n20
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n30
Value: #F5A655
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n30)
JavaScript: tokens.kda.foundation.color.palette.orange.n30
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n40
Value: #EC9046
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n40)
JavaScript: tokens.kda.foundation.color.palette.orange.n40
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n5
Value: #FFDFAD
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n5)
JavaScript: tokens.kda.foundation.color.palette.orange.n5
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n50
Value: #E27B38
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n50)
JavaScript: tokens.kda.foundation.color.palette.orange.n50
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n60
Value: #CB5D00
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n60)
JavaScript: tokens.kda.foundation.color.palette.orange.n60
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n70
Value: #B14C00
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n70)
JavaScript: tokens.kda.foundation.color.palette.orange.n70
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n80
Value: #953D00
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n80)
JavaScript: tokens.kda.foundation.color.palette.orange.n80
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n90
Value: #7A2F00
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n90)
JavaScript: tokens.kda.foundation.color.palette.orange.n90
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n95
Value: #612300
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n95)
JavaScript: tokens.kda.foundation.color.palette.orange.n95
☀️ light
🌙 dark
kda.foundation.color.palette.orange.n99
Value: #491901
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-orange-n99)
JavaScript: tokens.kda.foundation.color.palette.orange.n99
☀️ light
🌙 dark
kda.foundation.color.palette.red.n0
Value: #FFF5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n0)
JavaScript: tokens.kda.foundation.color.palette.red.n0
☀️ light
🌙 dark
kda.foundation.color.palette.red.n1
Value: #FFEBE7
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n1)
JavaScript: tokens.kda.foundation.color.palette.red.n1
☀️ light
🌙 dark
kda.foundation.color.palette.red.n10
Value: #FFCDC3
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n10)
JavaScript: tokens.kda.foundation.color.palette.red.n10
☀️ light
🌙 dark
kda.foundation.color.palette.red.n100
Value: #330000
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n100)
JavaScript: tokens.kda.foundation.color.palette.red.n100
☀️ light
🌙 dark
kda.foundation.color.palette.red.n20
Value: #FFB7A9
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n20)
JavaScript: tokens.kda.foundation.color.palette.red.n20
☀️ light
🌙 dark
kda.foundation.color.palette.red.n20@alpha20

Generated from kda.foundation.color.palette.red.n20 with alpha(20)

Value: #ffb7a933
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n20@alpha20)
JavaScript: tokens.kda.foundation.color.palette.red.n20@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.red.n20@alpha80

Generated from kda.foundation.color.palette.red.n20 with alpha(80)

Value: #ffb7a9cc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n20@alpha80)
JavaScript: tokens.kda.foundation.color.palette.red.n20@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.red.n30
Value: #FF9B88
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n30)
JavaScript: tokens.kda.foundation.color.palette.red.n30
☀️ light
🌙 dark
kda.foundation.color.palette.red.n40
Value: #FF7C65
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n40)
JavaScript: tokens.kda.foundation.color.palette.red.n40
☀️ light
🌙 dark
kda.foundation.color.palette.red.n5
Value: #FFDDD6
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n5)
JavaScript: tokens.kda.foundation.color.palette.red.n5
☀️ light
🌙 dark
kda.foundation.color.palette.red.n50
Value: #F75C46
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n50)
JavaScript: tokens.kda.foundation.color.palette.red.n50
☀️ light
🌙 dark
kda.foundation.color.palette.red.n60
Value: #EA3829
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n60)
JavaScript: tokens.kda.foundation.color.palette.red.n60
☀️ light
🌙 dark
kda.foundation.color.palette.red.n70
Value: #D31510
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n70)
JavaScript: tokens.kda.foundation.color.palette.red.n70
☀️ light
🌙 dark
kda.foundation.color.palette.red.n80
Value: #B40000
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n80)
JavaScript: tokens.kda.foundation.color.palette.red.n80
☀️ light
🌙 dark
kda.foundation.color.palette.red.n80@alpha20

Generated from kda.foundation.color.palette.red.n80 with alpha(20)

Value: #b4000033
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n80@alpha20)
JavaScript: tokens.kda.foundation.color.palette.red.n80@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.red.n80@alpha80

Generated from kda.foundation.color.palette.red.n80 with alpha(80)

Value: #b40000cc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n80@alpha80)
JavaScript: tokens.kda.foundation.color.palette.red.n80@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.red.n90
Value: #930000
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n90)
JavaScript: tokens.kda.foundation.color.palette.red.n90
☀️ light
🌙 dark
kda.foundation.color.palette.red.n95
Value: #740000
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n95)
JavaScript: tokens.kda.foundation.color.palette.red.n95
☀️ light
🌙 dark
kda.foundation.color.palette.red.n99
Value: #590000
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-red-n99)
JavaScript: tokens.kda.foundation.color.palette.red.n99
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n0
Value: #FBF8DD
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n0)
JavaScript: tokens.kda.foundation.color.palette.yellow.n0
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n1
Value: #FBF198
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n1)
JavaScript: tokens.kda.foundation.color.palette.yellow.n1
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n10
Value: #F8D904
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n10)
JavaScript: tokens.kda.foundation.color.palette.yellow.n10
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n100
Value: #1A1100
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n100)
JavaScript: tokens.kda.foundation.color.palette.yellow.n100
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n20
Value: #E8C600
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n20)
JavaScript: tokens.kda.foundation.color.palette.yellow.n20
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n20@alpha20

Generated from kda.foundation.color.palette.yellow.n20 with alpha(20)

Value: #e8c60033
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n20@alpha20)
JavaScript: tokens.kda.foundation.color.palette.yellow.n20@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n20@alpha80

Generated from kda.foundation.color.palette.yellow.n20 with alpha(80)

Value: #e8c600cc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n20@alpha80)
JavaScript: tokens.kda.foundation.color.palette.yellow.n20@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n30
Value: #D7B300
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n30)
JavaScript: tokens.kda.foundation.color.palette.yellow.n30
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n40
Value: #C49F00
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n40)
JavaScript: tokens.kda.foundation.color.palette.yellow.n40
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n5
Value: #F8E750
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n5)
JavaScript: tokens.kda.foundation.color.palette.yellow.n5
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n50
Value: #B08C00
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n50)
JavaScript: tokens.kda.foundation.color.palette.yellow.n50
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n60
Value: #9B7800
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n60)
JavaScript: tokens.kda.foundation.color.palette.yellow.n60
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n70
Value: #856600
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n70)
JavaScript: tokens.kda.foundation.color.palette.yellow.n70
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n80
Value: #705300
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n80)
JavaScript: tokens.kda.foundation.color.palette.yellow.n80
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n80@alpha20

Generated from kda.foundation.color.palette.yellow.n80 with alpha(20)

Value: #70530033
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n80@alpha20)
JavaScript: tokens.kda.foundation.color.palette.yellow.n80@alpha20
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n80@alpha80

Generated from kda.foundation.color.palette.yellow.n80 with alpha(80)

Value: #705300cc
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n80@alpha80)
JavaScript: tokens.kda.foundation.color.palette.yellow.n80@alpha80
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n90
Value: #5B4300
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n90)
JavaScript: tokens.kda.foundation.color.palette.yellow.n90
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n95
Value: #483300
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n95)
JavaScript: tokens.kda.foundation.color.palette.yellow.n95
☀️ light
🌙 dark
kda.foundation.color.palette.yellow.n99
Value: #362500
Usage Examples
CSS Variable: var(--kda-foundation-color-palette-yellow-n99)
JavaScript: tokens.kda.foundation.color.palette.yellow.n99
kda.foundation.color.semantic.info.n0
Value: #F0F8FF
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n0)
JavaScript: tokens.kda.foundation.color.semantic.info.n0
kda.foundation.color.semantic.info.n1
Value: #D6EBFF
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n1)
JavaScript: tokens.kda.foundation.color.semantic.info.n1
kda.foundation.color.semantic.info.n10
Value: #A0CBF4
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n10)
JavaScript: tokens.kda.foundation.color.semantic.info.n10
kda.foundation.color.semantic.info.n100
Value: #06101A
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n100)
JavaScript: tokens.kda.foundation.color.semantic.info.n100
kda.foundation.color.semantic.info.n20
Value: #86BCEE
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n20)
JavaScript: tokens.kda.foundation.color.semantic.info.n20
kda.foundation.color.semantic.info.n20@alpha20
Value: #86bcee33
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n20@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.info.n20@alpha20
kda.foundation.color.semantic.info.n20@alpha80
Value: #86bceecc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n20@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.info.n20@alpha80
kda.foundation.color.semantic.info.n30
Value: #6BACE8
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n30)
JavaScript: tokens.kda.foundation.color.semantic.info.n30
kda.foundation.color.semantic.info.n40
Value: #509CE3
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n40)
JavaScript: tokens.kda.foundation.color.semantic.info.n40
kda.foundation.color.semantic.info.n5
Value: #BBDBF9
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n5)
JavaScript: tokens.kda.foundation.color.semantic.info.n5
kda.foundation.color.semantic.info.n50
Value: #358CDD
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n50)
JavaScript: tokens.kda.foundation.color.semantic.info.n50
kda.foundation.color.semantic.info.n60
Value: #2E7AC0
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n60)
JavaScript: tokens.kda.foundation.color.semantic.info.n60
kda.foundation.color.semantic.info.n70
Value: #2767A3
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n70)
JavaScript: tokens.kda.foundation.color.semantic.info.n70
kda.foundation.color.semantic.info.n80
Value: #205586
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n80)
JavaScript: tokens.kda.foundation.color.semantic.info.n80
kda.foundation.color.semantic.info.n80@alpha20
Value: #20558633
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n80@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.info.n80@alpha20
kda.foundation.color.semantic.info.n80@alpha80
Value: #205586cc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n80@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.info.n80@alpha80
kda.foundation.color.semantic.info.n90
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n90)
JavaScript: tokens.kda.foundation.color.semantic.info.n90
kda.foundation.color.semantic.info.n95
Value: #112C46
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n95)
JavaScript: tokens.kda.foundation.color.semantic.info.n95
kda.foundation.color.semantic.info.n99
Value: #0B1D2E
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-info-n99)
JavaScript: tokens.kda.foundation.color.semantic.info.n99
kda.foundation.color.semantic.negative.n0
Value: #FFF5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n0)
JavaScript: tokens.kda.foundation.color.semantic.negative.n0
kda.foundation.color.semantic.negative.n1
Value: #FFEBE7
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n1)
JavaScript: tokens.kda.foundation.color.semantic.negative.n1
kda.foundation.color.semantic.negative.n10
Value: #FFCDC3
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n10)
JavaScript: tokens.kda.foundation.color.semantic.negative.n10
kda.foundation.color.semantic.negative.n100
Value: #330000
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n100)
JavaScript: tokens.kda.foundation.color.semantic.negative.n100
kda.foundation.color.semantic.negative.n20
Value: #FFB7A9
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n20)
JavaScript: tokens.kda.foundation.color.semantic.negative.n20
kda.foundation.color.semantic.negative.n20@alpha20
Value: #ffb7a933
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n20@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.negative.n20@alpha20
kda.foundation.color.semantic.negative.n20@alpha80
Value: #ffb7a9cc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n20@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.negative.n20@alpha80
kda.foundation.color.semantic.negative.n30
Value: #FF9B88
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n30)
JavaScript: tokens.kda.foundation.color.semantic.negative.n30
kda.foundation.color.semantic.negative.n40
Value: #FF7C65
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n40)
JavaScript: tokens.kda.foundation.color.semantic.negative.n40
kda.foundation.color.semantic.negative.n5
Value: #FFDDD6
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n5)
JavaScript: tokens.kda.foundation.color.semantic.negative.n5
kda.foundation.color.semantic.negative.n50
Value: #F75C46
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n50)
JavaScript: tokens.kda.foundation.color.semantic.negative.n50
kda.foundation.color.semantic.negative.n60
Value: #EA3829
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n60)
JavaScript: tokens.kda.foundation.color.semantic.negative.n60
kda.foundation.color.semantic.negative.n70
Value: #D31510
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n70)
JavaScript: tokens.kda.foundation.color.semantic.negative.n70
kda.foundation.color.semantic.negative.n80
Value: #B40000
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n80)
JavaScript: tokens.kda.foundation.color.semantic.negative.n80
kda.foundation.color.semantic.negative.n80@alpha20
Value: #b4000033
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n80@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.negative.n80@alpha20
kda.foundation.color.semantic.negative.n80@alpha80
Value: #b40000cc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n80@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.negative.n80@alpha80
kda.foundation.color.semantic.negative.n90
Value: #930000
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n90)
JavaScript: tokens.kda.foundation.color.semantic.negative.n90
kda.foundation.color.semantic.negative.n95
Value: #740000
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n95)
JavaScript: tokens.kda.foundation.color.semantic.negative.n95
kda.foundation.color.semantic.negative.n99
Value: #590000
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-negative-n99)
JavaScript: tokens.kda.foundation.color.semantic.negative.n99
kda.foundation.color.semantic.positive.n0
Value: #E9FCE3
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n0)
JavaScript: tokens.kda.foundation.color.semantic.positive.n0
kda.foundation.color.semantic.positive.n1
Value: #cdfcbf
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n1)
JavaScript: tokens.kda.foundation.color.semantic.positive.n1
kda.foundation.color.semantic.positive.n10
Value: #96ee85
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n10)
JavaScript: tokens.kda.foundation.color.semantic.positive.n10
kda.foundation.color.semantic.positive.n100
Value: #001A04
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n100)
JavaScript: tokens.kda.foundation.color.semantic.positive.n100
kda.foundation.color.semantic.positive.n20
Value: #72e06a
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n20)
JavaScript: tokens.kda.foundation.color.semantic.positive.n20
kda.foundation.color.semantic.positive.n20@alpha20
Value: #72e06a33
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n20@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.positive.n20@alpha20
kda.foundation.color.semantic.positive.n20@alpha80
Value: #72e06acc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n20@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.positive.n20@alpha80
kda.foundation.color.semantic.positive.n30
Value: #4ecf50
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n30)
JavaScript: tokens.kda.foundation.color.semantic.positive.n30
kda.foundation.color.semantic.positive.n40
Value: #27bb36
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n40)
JavaScript: tokens.kda.foundation.color.semantic.positive.n40
kda.foundation.color.semantic.positive.n5
Value: #aef69d
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n5)
JavaScript: tokens.kda.foundation.color.semantic.positive.n5
kda.foundation.color.semantic.positive.n50
Value: #07a721
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n50)
JavaScript: tokens.kda.foundation.color.semantic.positive.n50
kda.foundation.color.semantic.positive.n60
Value: #009112
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n60)
JavaScript: tokens.kda.foundation.color.semantic.positive.n60
kda.foundation.color.semantic.positive.n70
Value: #007c0f
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n70)
JavaScript: tokens.kda.foundation.color.semantic.positive.n70
kda.foundation.color.semantic.positive.n80
Value: #00670f
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n80)
JavaScript: tokens.kda.foundation.color.semantic.positive.n80
kda.foundation.color.semantic.positive.n80@alpha20
Value: #00670f33
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n80@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.positive.n80@alpha20
kda.foundation.color.semantic.positive.n80@alpha80
Value: #00670fcc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n80@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.positive.n80@alpha80
kda.foundation.color.semantic.positive.n90
Value: #00530d
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n90)
JavaScript: tokens.kda.foundation.color.semantic.positive.n90
kda.foundation.color.semantic.positive.n95
Value: #00400a
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n95)
JavaScript: tokens.kda.foundation.color.semantic.positive.n95
kda.foundation.color.semantic.positive.n99
Value: #003007
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-positive-n99)
JavaScript: tokens.kda.foundation.color.semantic.positive.n99
kda.foundation.color.semantic.warning.n0
Value: #FBF8DD
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n0)
JavaScript: tokens.kda.foundation.color.semantic.warning.n0
kda.foundation.color.semantic.warning.n1
Value: #FBF198
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n1)
JavaScript: tokens.kda.foundation.color.semantic.warning.n1
kda.foundation.color.semantic.warning.n10
Value: #F8D904
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n10)
JavaScript: tokens.kda.foundation.color.semantic.warning.n10
kda.foundation.color.semantic.warning.n100
Value: #1A1100
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n100)
JavaScript: tokens.kda.foundation.color.semantic.warning.n100
kda.foundation.color.semantic.warning.n20
Value: #E8C600
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n20)
JavaScript: tokens.kda.foundation.color.semantic.warning.n20
kda.foundation.color.semantic.warning.n20@alpha20
Value: #e8c60033
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n20@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.warning.n20@alpha20
kda.foundation.color.semantic.warning.n20@alpha80
Value: #e8c600cc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n20@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.warning.n20@alpha80
kda.foundation.color.semantic.warning.n30
Value: #D7B300
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n30)
JavaScript: tokens.kda.foundation.color.semantic.warning.n30
kda.foundation.color.semantic.warning.n40
Value: #C49F00
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n40)
JavaScript: tokens.kda.foundation.color.semantic.warning.n40
kda.foundation.color.semantic.warning.n5
Value: #F8E750
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n5)
JavaScript: tokens.kda.foundation.color.semantic.warning.n5
kda.foundation.color.semantic.warning.n50
Value: #B08C00
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n50)
JavaScript: tokens.kda.foundation.color.semantic.warning.n50
kda.foundation.color.semantic.warning.n60
Value: #9B7800
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n60)
JavaScript: tokens.kda.foundation.color.semantic.warning.n60
kda.foundation.color.semantic.warning.n70
Value: #856600
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n70)
JavaScript: tokens.kda.foundation.color.semantic.warning.n70
kda.foundation.color.semantic.warning.n80
Value: #705300
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n80)
JavaScript: tokens.kda.foundation.color.semantic.warning.n80
kda.foundation.color.semantic.warning.n80@alpha20
Value: #70530033
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n80@alpha20)
JavaScript: tokens.kda.foundation.color.semantic.warning.n80@alpha20
kda.foundation.color.semantic.warning.n80@alpha80
Value: #705300cc
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n80@alpha80)
JavaScript: tokens.kda.foundation.color.semantic.warning.n80@alpha80
kda.foundation.color.semantic.warning.n90
Value: #5B4300
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n90)
JavaScript: tokens.kda.foundation.color.semantic.warning.n90
kda.foundation.color.semantic.warning.n95
Value: #483300
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n95)
JavaScript: tokens.kda.foundation.color.semantic.warning.n95
kda.foundation.color.semantic.warning.n99
Value: #362500
Usage Examples
CSS Variable: var(--kda-foundation-color-semantic-warning-n99)
JavaScript: tokens.kda.foundation.color.semantic.warning.n99
kda.foundation.color.text.accent.primary.@active
Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-@active)
JavaScript: tokens.kda.foundation.color.text.accent.primary.@active
kda.foundation.color.text.accent.primary.@focus
Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-@focus)
JavaScript: tokens.kda.foundation.color.text.accent.primary.@focus
kda.foundation.color.text.accent.primary.@hover
Value: #131E2B
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-@hover)
JavaScript: tokens.kda.foundation.color.text.accent.primary.@hover
kda.foundation.color.text.accent.primary.default
Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-default)
JavaScript: tokens.kda.foundation.color.text.accent.primary.default
kda.foundation.color.text.accent.primary.inverse.@active
Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-inverse-@active)
JavaScript: tokens.kda.foundation.color.text.accent.primary.inverse.@active
kda.foundation.color.text.accent.primary.inverse.@focus
Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.accent.primary.inverse.@focus
kda.foundation.color.text.accent.primary.inverse.@hover
Value: #E4E5E5
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.accent.primary.inverse.@hover
kda.foundation.color.text.accent.primary.inverse.default
Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-accent-primary-inverse-default)
JavaScript: tokens.kda.foundation.color.text.accent.primary.inverse.default
kda.foundation.color.text.base.@active

Use for text in a active state.

Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-@active)
JavaScript: tokens.kda.foundation.color.text.base.@active
kda.foundation.color.text.base.@disabled

Use for text in a disabled state.

Value: #00000066
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-@disabled)
JavaScript: tokens.kda.foundation.color.text.base.@disabled
kda.foundation.color.text.base.@focus

Use for text in a focus state.

Value: #020E1B
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-@focus)
JavaScript: tokens.kda.foundation.color.text.base.@focus
kda.foundation.color.text.base.@hover

Use for text in a hover state.

Value: #131E2B
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-@hover)
JavaScript: tokens.kda.foundation.color.text.base.@hover
kda.foundation.color.text.base.@init

Use for primary text @init for buttons.

Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-@init)
JavaScript: tokens.kda.foundation.color.text.base.@init
kda.foundation.color.text.base.@selected

Use for text in selected or opened states, such as tabs and dropdown buttons.

Value: #000000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-@selected)
JavaScript: tokens.kda.foundation.color.text.base.@selected
kda.foundation.color.text.base.default

Use for primary text, such as body copy, sentence case headers.

Value: #000000f2
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-default)
JavaScript: tokens.kda.foundation.color.text.base.default
kda.foundation.color.text.base.inverse.@active

Use for text in a active state.

Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-inverse-@active)
JavaScript: tokens.kda.foundation.color.text.base.inverse.@active
kda.foundation.color.text.base.inverse.@disabled

Use for text in a disabled state.

Value: #ffffff66
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-inverse-@disabled)
JavaScript: tokens.kda.foundation.color.text.base.inverse.@disabled
kda.foundation.color.text.base.inverse.@focus

Use for text in a focus state.

Value: #F5F5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.base.inverse.@focus
kda.foundation.color.text.base.inverse.@hover

Use for text in a hover state.

Value: #E4E5E5
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.base.inverse.@hover
kda.foundation.color.text.base.inverse.@init

Use for primary text @init for buttons.

Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-inverse-@init)
JavaScript: tokens.kda.foundation.color.text.base.inverse.@init
kda.foundation.color.text.base.inverse.@selected

Use for text in selected or opened states, such as tabs and dropdown buttons.

Value: #FFFFFF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-inverse-@selected)
JavaScript: tokens.kda.foundation.color.text.base.inverse.@selected
kda.foundation.color.text.base.inverse.default

Use for text on bold backgrounds.

Value: #fffffff2
Usage Examples
CSS Variable: var(--kda-foundation-color-text-base-inverse-default)
JavaScript: tokens.kda.foundation.color.text.base.inverse.default
kda.foundation.color.text.brand.primary.@focus
Value: #0A2E1D
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-primary-@focus)
JavaScript: tokens.kda.foundation.color.text.brand.primary.@focus
kda.foundation.color.text.brand.primary.@hover
Value: #153E2C
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-primary-@hover)
JavaScript: tokens.kda.foundation.color.text.brand.primary.@hover
kda.foundation.color.text.brand.primary.default
Value: #1F4F3C
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-primary-default)
JavaScript: tokens.kda.foundation.color.text.brand.primary.default
kda.foundation.color.text.brand.primary.inverse.@focus
Value: #CEF8E0
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-primary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.brand.primary.inverse.@focus
kda.foundation.color.text.brand.primary.inverse.@hover
Value: #B8E7CF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-primary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.brand.primary.inverse.@hover
kda.foundation.color.text.brand.primary.inverse.default
Value: #A2D5BE
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-primary-inverse-default)
JavaScript: tokens.kda.foundation.color.text.brand.primary.inverse.default
kda.foundation.color.text.brand.secondary.@focus
Value: #0B1D2E
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-secondary-@focus)
JavaScript: tokens.kda.foundation.color.text.brand.secondary.@focus
kda.foundation.color.text.brand.secondary.@hover
Value: #112C46
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-secondary-@hover)
JavaScript: tokens.kda.foundation.color.text.brand.secondary.@hover
kda.foundation.color.text.brand.secondary.default
Value: #194268
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-secondary-default)
JavaScript: tokens.kda.foundation.color.text.brand.secondary.default
kda.foundation.color.text.brand.secondary.inverse.@focus
Value: #D6EBFF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-secondary-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.brand.secondary.inverse.@focus
kda.foundation.color.text.brand.secondary.inverse.@hover
Value: #BBDBF9
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-secondary-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.brand.secondary.inverse.@hover
kda.foundation.color.text.brand.secondary.inverse.default
Value: #A0CBF4
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-secondary-inverse-default)
JavaScript: tokens.kda.foundation.color.text.brand.secondary.inverse.default
kda.foundation.color.text.brand.wordmark.default
Value: #0F0F0F
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-wordmark-default)
JavaScript: tokens.kda.foundation.color.text.brand.wordmark.default
kda.foundation.color.text.brand.wordmark.inverse.default
Value: #F0EAE6
Usage Examples
CSS Variable: var(--kda-foundation-color-text-brand-wordmark-inverse-default)
JavaScript: tokens.kda.foundation.color.text.brand.wordmark.inverse.default
kda.foundation.color.text.gray.bolder
Value: #475059
Usage Examples
CSS Variable: var(--kda-foundation-color-text-gray-bolder)
JavaScript: tokens.kda.foundation.color.text.gray.bolder
kda.foundation.color.text.gray.default
Value: #00000066
Usage Examples
CSS Variable: var(--kda-foundation-color-text-gray-default)
JavaScript: tokens.kda.foundation.color.text.gray.default
kda.foundation.color.text.gray.inverse.bolder
Value: #B0B3B7
Usage Examples
CSS Variable: var(--kda-foundation-color-text-gray-inverse-bolder)
JavaScript: tokens.kda.foundation.color.text.gray.inverse.bolder
kda.foundation.color.text.gray.inverse.default
Value: #ffffff66
Usage Examples
CSS Variable: var(--kda-foundation-color-text-gray-inverse-default)
JavaScript: tokens.kda.foundation.color.text.gray.inverse.default
kda.foundation.color.text.gray.inverse.lighter
Value: #8D9298
Usage Examples
CSS Variable: var(--kda-foundation-color-text-gray-inverse-lighter)
JavaScript: tokens.kda.foundation.color.text.gray.inverse.lighter
kda.foundation.color.text.gray.lighter
Value: #6A7178
Usage Examples
CSS Variable: var(--kda-foundation-color-text-gray-lighter)
JavaScript: tokens.kda.foundation.color.text.gray.lighter
kda.foundation.color.text.semantic.info.@focus
Value: #06101A
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-info-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.info.@focus
kda.foundation.color.text.semantic.info.@hover
Value: #06101A
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-info-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.info.@hover
kda.foundation.color.text.semantic.info.default
Value: #0B1D2E
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-info-default)
JavaScript: tokens.kda.foundation.color.text.semantic.info.default
kda.foundation.color.text.semantic.info.inverse.@focus
Value: #F0F8FF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-info-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.info.inverse.@focus
kda.foundation.color.text.semantic.info.inverse.@hover
Value: #F0F8FF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-info-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.info.inverse.@hover
kda.foundation.color.text.semantic.info.inverse.default
Value: #D6EBFF
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-info-inverse-default)
JavaScript: tokens.kda.foundation.color.text.semantic.info.inverse.default
kda.foundation.color.text.semantic.negative.@focus
Value: #330000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-negative-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.negative.@focus
kda.foundation.color.text.semantic.negative.@hover
Value: #330000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-negative-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.negative.@hover
kda.foundation.color.text.semantic.negative.default
Value: #590000
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-negative-default)
JavaScript: tokens.kda.foundation.color.text.semantic.negative.default
kda.foundation.color.text.semantic.negative.inverse.@focus
Value: #FFF5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-negative-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.negative.inverse.@focus
kda.foundation.color.text.semantic.negative.inverse.@hover
Value: #FFF5F5
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-negative-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.negative.inverse.@hover
kda.foundation.color.text.semantic.negative.inverse.default
Value: #FFEBE7
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-negative-inverse-default)
JavaScript: tokens.kda.foundation.color.text.semantic.negative.inverse.default
kda.foundation.color.text.semantic.positive.@focus
Value: #001A04
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-positive-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.positive.@focus
kda.foundation.color.text.semantic.positive.@hover
Value: #001A04
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-positive-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.positive.@hover
kda.foundation.color.text.semantic.positive.default
Value: #003007
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-positive-default)
JavaScript: tokens.kda.foundation.color.text.semantic.positive.default
kda.foundation.color.text.semantic.positive.inverse.@focus
Value: #E9FCE3
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-positive-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.positive.inverse.@focus
kda.foundation.color.text.semantic.positive.inverse.@hover
Value: #E9FCE3
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-positive-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.positive.inverse.@hover
kda.foundation.color.text.semantic.positive.inverse.default
Value: #cdfcbf
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-positive-inverse-default)
JavaScript: tokens.kda.foundation.color.text.semantic.positive.inverse.default
kda.foundation.color.text.semantic.warning.@focus
Value: #1A1100
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-warning-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.warning.@focus
kda.foundation.color.text.semantic.warning.@hover
Value: #1A1100
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-warning-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.warning.@hover
kda.foundation.color.text.semantic.warning.default
Value: #362500
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-warning-default)
JavaScript: tokens.kda.foundation.color.text.semantic.warning.default
kda.foundation.color.text.semantic.warning.inverse.@focus
Value: #FBF8DD
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-warning-inverse-@focus)
JavaScript: tokens.kda.foundation.color.text.semantic.warning.inverse.@focus
kda.foundation.color.text.semantic.warning.inverse.@hover
Value: #FBF8DD
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-warning-inverse-@hover)
JavaScript: tokens.kda.foundation.color.text.semantic.warning.inverse.@hover
kda.foundation.color.text.semantic.warning.inverse.default
Value: #FBF198
Usage Examples
CSS Variable: var(--kda-foundation-color-text-semantic-warning-inverse-default)
JavaScript: tokens.kda.foundation.color.text.semantic.warning.inverse.default
kda.foundation.color.text.subtle.@hover
Value: #000000f2
Usage Examples
CSS Variable: var(--kda-foundation-color-text-subtle-@hover)
JavaScript: tokens.kda.foundation.color.text.subtle.@hover
kda.foundation.color.text.subtle.default
Value: #000000cc
Usage Examples
CSS Variable: var(--kda-foundation-color-text-subtle-default)
JavaScript: tokens.kda.foundation.color.text.subtle.default
kda.foundation.color.text.subtle.inverse.default
Value: #fffffff2
Usage Examples
CSS Variable: var(--kda-foundation-color-text-subtle-inverse-default)
JavaScript: tokens.kda.foundation.color.text.subtle.inverse.default
kda.foundation.color.text.subtlest.@hover
Value: #000000cc
Usage Examples
CSS Variable: var(--kda-foundation-color-text-subtlest-@hover)
JavaScript: tokens.kda.foundation.color.text.subtlest.@hover
kda.foundation.color.text.subtlest.default
Value: #000000b3
Usage Examples
CSS Variable: var(--kda-foundation-color-text-subtlest-default)
JavaScript: tokens.kda.foundation.color.text.subtlest.default
kda.foundation.color.text.subtlest.inverse.default
Value: #ffffffb3
Usage Examples
CSS Variable: var(--kda-foundation-color-text-subtlest-inverse-default)
JavaScript: tokens.kda.foundation.color.text.subtlest.inverse.default

📏 Dimensions 160

1px
kda.foundation.border.width.hairline
Value: 1px
Usage Examples
CSS Variable: var(--kda-foundation-border-width-hairline)
JavaScript: tokens.kda.foundation.border.width.hairline
2px
kda.foundation.border.width.normal
Value: 2px
Usage Examples
CSS Variable: var(--kda-foundation-border-width-normal)
JavaScript: tokens.kda.foundation.border.width.normal
4px
kda.foundation.border.width.thick
Value: 4px
Usage Examples
CSS Variable: var(--kda-foundation-border-width-thick)
JavaScript: tokens.kda.foundation.border.width.thick
64rem
kda.foundation.breakpoint.lg
Value: 64rem
Usage Examples
CSS Variable: var(--kda-foundation-breakpoint-lg)
JavaScript: tokens.kda.foundation.breakpoint.lg
48rem
kda.foundation.breakpoint.md
Value: 48rem
Usage Examples
CSS Variable: var(--kda-foundation-breakpoint-md)
JavaScript: tokens.kda.foundation.breakpoint.md
40rem
kda.foundation.breakpoint.sm
Value: 40rem
Usage Examples
CSS Variable: var(--kda-foundation-breakpoint-sm)
JavaScript: tokens.kda.foundation.breakpoint.sm
80rem
kda.foundation.breakpoint.xl
Value: 80rem
Usage Examples
CSS Variable: var(--kda-foundation-breakpoint-xl)
JavaScript: tokens.kda.foundation.breakpoint.xl
0rem
kda.foundation.breakpoint.xs
Value: 0rem
Usage Examples
CSS Variable: var(--kda-foundation-breakpoint-xs)
JavaScript: tokens.kda.foundation.breakpoint.xs
96rem
kda.foundation.breakpoint.xxl
Value: 96rem
Usage Examples
CSS Variable: var(--kda-foundation-breakpoint-xxl)
JavaScript: tokens.kda.foundation.breakpoint.xxl
1.5rem
kda.foundation.icon.size.base
Value: 1.5rem
Usage Examples
CSS Variable: var(--kda-foundation-icon-size-base)
JavaScript: tokens.kda.foundation.icon.size.base
2rem
kda.foundation.icon.size.lg
Value: 2rem
Usage Examples
CSS Variable: var(--kda-foundation-icon-size-lg)
JavaScript: tokens.kda.foundation.icon.size.lg
1.25rem
kda.foundation.icon.size.sm
Value: 1.25rem
Usage Examples
CSS Variable: var(--kda-foundation-icon-size-sm)
JavaScript: tokens.kda.foundation.icon.size.sm
2.5rem
kda.foundation.icon.size.xl
Value: 2.5rem
Usage Examples
CSS Variable: var(--kda-foundation-icon-size-xl)
JavaScript: tokens.kda.foundation.icon.size.xl
1rem
kda.foundation.icon.size.xs
Value: 1rem
Usage Examples
CSS Variable: var(--kda-foundation-icon-size-xs)
JavaScript: tokens.kda.foundation.icon.size.xs
4rem
kda.foundation.icon.size.xxl
Value: 4rem
Usage Examples
CSS Variable: var(--kda-foundation-icon-size-xxl)
JavaScript: tokens.kda.foundation.icon.size.xxl
0.75rem
kda.foundation.icon.size.xxs
Value: 0.75rem
Usage Examples
CSS Variable: var(--kda-foundation-icon-size-xxs)
JavaScript: tokens.kda.foundation.icon.size.xxs
42.5rem
kda.foundation.layout.content.maxWidth
Value: 42.5rem
Usage Examples
CSS Variable: var(--kda-foundation-layout-content-maxWidth)
JavaScript: tokens.kda.foundation.layout.content.maxWidth
33.75rem
kda.foundation.layout.content.minWidth
Value: 33.75rem
Usage Examples
CSS Variable: var(--kda-foundation-layout-content-minWidth)
JavaScript: tokens.kda.foundation.layout.content.minWidth
8px
kda.foundation.radius.lg
Value: 8px
Usage Examples
CSS Variable: var(--kda-foundation-radius-lg)
JavaScript: tokens.kda.foundation.radius.lg
6px
kda.foundation.radius.md
Value: 6px
Usage Examples
CSS Variable: var(--kda-foundation-radius-md)
JavaScript: tokens.kda.foundation.radius.md
7px
kda.foundation.radius.md-outline
Value: 7px
Usage Examples
CSS Variable: var(--kda-foundation-radius-md-outline)
JavaScript: tokens.kda.foundation.radius.md-outline
0px
kda.foundation.radius.no
Value: 0px
Usage Examples
CSS Variable: var(--kda-foundation-radius-no)
JavaScript: tokens.kda.foundation.radius.no
999rem
kda.foundation.radius.round
Value: 999rem
Usage Examples
CSS Variable: var(--kda-foundation-radius-round)
JavaScript: tokens.kda.foundation.radius.round
4px
kda.foundation.radius.sm
Value: 4px
Usage Examples
CSS Variable: var(--kda-foundation-radius-sm)
JavaScript: tokens.kda.foundation.radius.sm
5px
kda.foundation.radius.sm-outline
Value: 5px
Usage Examples
CSS Variable: var(--kda-foundation-radius-sm-outline)
JavaScript: tokens.kda.foundation.radius.sm-outline
16px
kda.foundation.radius.xl
Value: 16px
Usage Examples
CSS Variable: var(--kda-foundation-radius-xl)
JavaScript: tokens.kda.foundation.radius.xl
2px
kda.foundation.radius.xs
Value: 2px
Usage Examples
CSS Variable: var(--kda-foundation-radius-xs)
JavaScript: tokens.kda.foundation.radius.xs
3px
kda.foundation.radius.xs-outline
Value: 3px
Usage Examples
CSS Variable: var(--kda-foundation-radius-xs-outline)
JavaScript: tokens.kda.foundation.radius.xs-outline
24px
kda.foundation.radius.xxl
Value: 24px
Usage Examples
CSS Variable: var(--kda-foundation-radius-xxl)
JavaScript: tokens.kda.foundation.radius.xxl
1440px
kda.foundation.screen.resolutions.height.desktop.2k
Value: 1440px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-desktop-2k)
JavaScript: tokens.kda.foundation.screen.resolutions.height.desktop.2k
2160px
kda.foundation.screen.resolutions.height.desktop.4k
Value: 2160px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-desktop-4k)
JavaScript: tokens.kda.foundation.screen.resolutions.height.desktop.4k
1080px
kda.foundation.screen.resolutions.height.desktop.full_hd
Value: 1080px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-desktop-full_hd)
JavaScript: tokens.kda.foundation.screen.resolutions.height.desktop.full_hd
768px
kda.foundation.screen.resolutions.height.desktop.hd
Value: 768px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-desktop-hd)
JavaScript: tokens.kda.foundation.screen.resolutions.height.desktop.hd
768px
kda.foundation.screen.resolutions.height.desktop.small
Value: 768px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-desktop-small)
JavaScript: tokens.kda.foundation.screen.resolutions.height.desktop.small
1440px
kda.foundation.screen.resolutions.height.desktop.ultra_wide
Value: 1440px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-desktop-ultra_wide)
JavaScript: tokens.kda.foundation.screen.resolutions.height.desktop.ultra_wide
800px
kda.foundation.screen.resolutions.height.desktop.widescreen
Value: 800px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-desktop-widescreen)
JavaScript: tokens.kda.foundation.screen.resolutions.height.desktop.widescreen
900px
kda.foundation.screen.resolutions.height.laptop.macBook_air
Value: 900px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-laptop-macBook_air)
JavaScript: tokens.kda.foundation.screen.resolutions.height.laptop.macBook_air
800px
kda.foundation.screen.resolutions.height.laptop.macBook_pro_13
Value: 800px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-laptop-macBook_pro_13)
JavaScript: tokens.kda.foundation.screen.resolutions.height.laptop.macBook_pro_13
1920px
kda.foundation.screen.resolutions.height.laptop.macBook_pro_16
Value: 1920px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-laptop-macBook_pro_16)
JavaScript: tokens.kda.foundation.screen.resolutions.height.laptop.macBook_pro_16
812px
kda.foundation.screen.resolutions.height.mobile.apple.iphone_11
Value: 812px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-mobile-apple-iphone_11)
JavaScript: tokens.kda.foundation.screen.resolutions.height.mobile.apple.iphone_11
896px
kda.foundation.screen.resolutions.height.mobile.apple.iphone_11_pro
Value: 896px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-mobile-apple-iphone_11_pro)
JavaScript: tokens.kda.foundation.screen.resolutions.height.mobile.apple.iphone_11_pro
667px
kda.foundation.screen.resolutions.height.mobile.apple.iphone_8
Value: 667px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-mobile-apple-iphone_8)
JavaScript: tokens.kda.foundation.screen.resolutions.height.mobile.apple.iphone_8
568px
kda.foundation.screen.resolutions.height.mobile.apple.iphone_se
Value: 568px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-mobile-apple-iphone_se)
JavaScript: tokens.kda.foundation.screen.resolutions.height.mobile.apple.iphone_se
740px
kda.foundation.screen.resolutions.height.mobile.samsung.galaxy_s9
Value: 740px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-mobile-samsung-galaxy_s9)
JavaScript: tokens.kda.foundation.screen.resolutions.height.mobile.samsung.galaxy_s9
1080px
kda.foundation.screen.resolutions.height.tablet.apple.ipad
Value: 1080px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-tablet-apple-ipad)
JavaScript: tokens.kda.foundation.screen.resolutions.height.tablet.apple.ipad
1024px
kda.foundation.screen.resolutions.height.tablet.apple.ipad_mini
Value: 1024px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-tablet-apple-ipad_mini)
JavaScript: tokens.kda.foundation.screen.resolutions.height.tablet.apple.ipad_mini
1366px
kda.foundation.screen.resolutions.height.tablet.apple.ipad_pro
Value: 1366px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-height-tablet-apple-ipad_pro)
JavaScript: tokens.kda.foundation.screen.resolutions.height.tablet.apple.ipad_pro
2560px
kda.foundation.screen.resolutions.width.desktop.2k
Value: 2560px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-desktop-2k)
JavaScript: tokens.kda.foundation.screen.resolutions.width.desktop.2k
3840px
kda.foundation.screen.resolutions.width.desktop.4k
Value: 3840px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-desktop-4k)
JavaScript: tokens.kda.foundation.screen.resolutions.width.desktop.4k
1920px
kda.foundation.screen.resolutions.width.desktop.full_hd
Value: 1920px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-desktop-full_hd)
JavaScript: tokens.kda.foundation.screen.resolutions.width.desktop.full_hd
1366px
kda.foundation.screen.resolutions.width.desktop.hd
Value: 1366px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-desktop-hd)
JavaScript: tokens.kda.foundation.screen.resolutions.width.desktop.hd
1024px
kda.foundation.screen.resolutions.width.desktop.small
Value: 1024px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-desktop-small)
JavaScript: tokens.kda.foundation.screen.resolutions.width.desktop.small
3440px
kda.foundation.screen.resolutions.width.desktop.ultra_wide
Value: 3440px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-desktop-ultra_wide)
JavaScript: tokens.kda.foundation.screen.resolutions.width.desktop.ultra_wide
1280px
kda.foundation.screen.resolutions.width.desktop.widescreen
Value: 1280px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-desktop-widescreen)
JavaScript: tokens.kda.foundation.screen.resolutions.width.desktop.widescreen
1440px
kda.foundation.screen.resolutions.width.laptop.macBook_air
Value: 1440px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-laptop-macBook_air)
JavaScript: tokens.kda.foundation.screen.resolutions.width.laptop.macBook_air
1280px
kda.foundation.screen.resolutions.width.laptop.macBook_pro_13
Value: 1280px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-laptop-macBook_pro_13)
JavaScript: tokens.kda.foundation.screen.resolutions.width.laptop.macBook_pro_13
3072px
kda.foundation.screen.resolutions.width.laptop.macBook_pro_16
Value: 3072px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-laptop-macBook_pro_16)
JavaScript: tokens.kda.foundation.screen.resolutions.width.laptop.macBook_pro_16
375px
kda.foundation.screen.resolutions.width.mobile.apple.iphone_11
Value: 375px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-mobile-apple-iphone_11)
JavaScript: tokens.kda.foundation.screen.resolutions.width.mobile.apple.iphone_11
414px
kda.foundation.screen.resolutions.width.mobile.apple.iphone_11_pro
Value: 414px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-mobile-apple-iphone_11_pro)
JavaScript: tokens.kda.foundation.screen.resolutions.width.mobile.apple.iphone_11_pro
375px
kda.foundation.screen.resolutions.width.mobile.apple.iphone_8
Value: 375px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-mobile-apple-iphone_8)
JavaScript: tokens.kda.foundation.screen.resolutions.width.mobile.apple.iphone_8
320px
kda.foundation.screen.resolutions.width.mobile.apple.iphone_se
Value: 320px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-mobile-apple-iphone_se)
JavaScript: tokens.kda.foundation.screen.resolutions.width.mobile.apple.iphone_se
360px
kda.foundation.screen.resolutions.width.mobile.samsung.galaxy_s9
Value: 360px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-mobile-samsung-galaxy_s9)
JavaScript: tokens.kda.foundation.screen.resolutions.width.mobile.samsung.galaxy_s9
810px
kda.foundation.screen.resolutions.width.tablet.apple.ipad
Value: 810px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-tablet-apple-ipad)
JavaScript: tokens.kda.foundation.screen.resolutions.width.tablet.apple.ipad
768px
kda.foundation.screen.resolutions.width.tablet.apple.ipad_mini
Value: 768px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-tablet-apple-ipad_mini)
JavaScript: tokens.kda.foundation.screen.resolutions.width.tablet.apple.ipad_mini
1024px
kda.foundation.screen.resolutions.width.tablet.apple.ipad_pro
Value: 1024px
Usage Examples
CSS Variable: var(--kda-foundation-screen-resolutions-width-tablet-apple-ipad_pro)
JavaScript: tokens.kda.foundation.screen.resolutions.width.tablet.apple.ipad_pro
0px
kda.foundation.size.n0
Value: 0px
Usage Examples
CSS Variable: var(--kda-foundation-size-n0)
JavaScript: tokens.kda.foundation.size.n0
0.25rem
kda.foundation.size.n1
Value: 0.25rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n1)
JavaScript: tokens.kda.foundation.size.n1
2.5rem
kda.foundation.size.n10
Value: 2.5rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n10)
JavaScript: tokens.kda.foundation.size.n10
2.75rem
kda.foundation.size.n11
Value: 2.75rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n11)
JavaScript: tokens.kda.foundation.size.n11
3rem
kda.foundation.size.n12
Value: 3rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n12)
JavaScript: tokens.kda.foundation.size.n12
3.25rem
kda.foundation.size.n13
Value: 3.25rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n13)
JavaScript: tokens.kda.foundation.size.n13
3.5rem
kda.foundation.size.n14
Value: 3.5rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n14)
JavaScript: tokens.kda.foundation.size.n14
3.75rem
kda.foundation.size.n15
Value: 3.75rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n15)
JavaScript: tokens.kda.foundation.size.n15
4rem
kda.foundation.size.n16
Value: 4rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n16)
JavaScript: tokens.kda.foundation.size.n16
4.25rem
kda.foundation.size.n17
Value: 4.25rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n17)
JavaScript: tokens.kda.foundation.size.n17
4.5rem
kda.foundation.size.n18
Value: 4.5rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n18)
JavaScript: tokens.kda.foundation.size.n18
4.75rem
kda.foundation.size.n19
Value: 4.75rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n19)
JavaScript: tokens.kda.foundation.size.n19
0.5rem
kda.foundation.size.n2
Value: 0.5rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n2)
JavaScript: tokens.kda.foundation.size.n2
5rem
kda.foundation.size.n20
Value: 5rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n20)
JavaScript: tokens.kda.foundation.size.n20
6rem
kda.foundation.size.n24
Value: 6rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n24)
JavaScript: tokens.kda.foundation.size.n24
6.25rem
kda.foundation.size.n25
Value: 6.25rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n25)
JavaScript: tokens.kda.foundation.size.n25
0.75rem
kda.foundation.size.n3
Value: 0.75rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n3)
JavaScript: tokens.kda.foundation.size.n3
7.5rem
kda.foundation.size.n30
Value: 7.5rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n30)
JavaScript: tokens.kda.foundation.size.n30
8rem
kda.foundation.size.n32
Value: 8rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n32)
JavaScript: tokens.kda.foundation.size.n32
8.75rem
kda.foundation.size.n35
Value: 8.75rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n35)
JavaScript: tokens.kda.foundation.size.n35
1rem
kda.foundation.size.n4
Value: 1rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n4)
JavaScript: tokens.kda.foundation.size.n4
10rem
kda.foundation.size.n40
Value: 10rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n40)
JavaScript: tokens.kda.foundation.size.n40
12rem
kda.foundation.size.n48
Value: 12rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n48)
JavaScript: tokens.kda.foundation.size.n48
1.25rem
kda.foundation.size.n5
Value: 1.25rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n5)
JavaScript: tokens.kda.foundation.size.n5
14rem
kda.foundation.size.n56
Value: 14rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n56)
JavaScript: tokens.kda.foundation.size.n56
1.5rem
kda.foundation.size.n6
Value: 1.5rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n6)
JavaScript: tokens.kda.foundation.size.n6
16rem
kda.foundation.size.n64
Value: 16rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n64)
JavaScript: tokens.kda.foundation.size.n64
1.75rem
kda.foundation.size.n7
Value: 1.75rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n7)
JavaScript: tokens.kda.foundation.size.n7
2rem
kda.foundation.size.n8
Value: 2rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n8)
JavaScript: tokens.kda.foundation.size.n8
2.25rem
kda.foundation.size.n9
Value: 2.25rem
Usage Examples
CSS Variable: var(--kda-foundation-size-n9)
JavaScript: tokens.kda.foundation.size.n9
1.5rem
kda.foundation.spacing.lg
Value: 1.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-lg)
JavaScript: tokens.kda.foundation.spacing.lg
1rem
kda.foundation.spacing.md
Value: 1rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-md)
JavaScript: tokens.kda.foundation.spacing.md
0px
kda.foundation.spacing.n0
Value: 0px
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n0)
JavaScript: tokens.kda.foundation.spacing.n0
0.25rem
kda.foundation.spacing.n1
Value: 0.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n1)
JavaScript: tokens.kda.foundation.spacing.n1
2.5rem
kda.foundation.spacing.n10
Value: 2.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n10)
JavaScript: tokens.kda.foundation.spacing.n10
2.75rem
kda.foundation.spacing.n11
Value: 2.75rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n11)
JavaScript: tokens.kda.foundation.spacing.n11
3rem
kda.foundation.spacing.n12
Value: 3rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n12)
JavaScript: tokens.kda.foundation.spacing.n12
3.25rem
kda.foundation.spacing.n13
Value: 3.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n13)
JavaScript: tokens.kda.foundation.spacing.n13
3.5rem
kda.foundation.spacing.n14
Value: 3.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n14)
JavaScript: tokens.kda.foundation.spacing.n14
3.75rem
kda.foundation.spacing.n15
Value: 3.75rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n15)
JavaScript: tokens.kda.foundation.spacing.n15
4rem
kda.foundation.spacing.n16
Value: 4rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n16)
JavaScript: tokens.kda.foundation.spacing.n16
4.25rem
kda.foundation.spacing.n17
Value: 4.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n17)
JavaScript: tokens.kda.foundation.spacing.n17
4.5rem
kda.foundation.spacing.n18
Value: 4.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n18)
JavaScript: tokens.kda.foundation.spacing.n18
4.75rem
kda.foundation.spacing.n19
Value: 4.75rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n19)
JavaScript: tokens.kda.foundation.spacing.n19
0.5rem
kda.foundation.spacing.n2
Value: 0.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n2)
JavaScript: tokens.kda.foundation.spacing.n2
5rem
kda.foundation.spacing.n20
Value: 5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n20)
JavaScript: tokens.kda.foundation.spacing.n20
6rem
kda.foundation.spacing.n24
Value: 6rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n24)
JavaScript: tokens.kda.foundation.spacing.n24
6.25rem
kda.foundation.spacing.n25
Value: 6.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n25)
JavaScript: tokens.kda.foundation.spacing.n25
0.75rem
kda.foundation.spacing.n3
Value: 0.75rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n3)
JavaScript: tokens.kda.foundation.spacing.n3
7.5rem
kda.foundation.spacing.n30
Value: 7.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n30)
JavaScript: tokens.kda.foundation.spacing.n30
8rem
kda.foundation.spacing.n32
Value: 8rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n32)
JavaScript: tokens.kda.foundation.spacing.n32
8.75rem
kda.foundation.spacing.n35
Value: 8.75rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n35)
JavaScript: tokens.kda.foundation.spacing.n35
1rem
kda.foundation.spacing.n4
Value: 1rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n4)
JavaScript: tokens.kda.foundation.spacing.n4
10rem
kda.foundation.spacing.n40
Value: 10rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n40)
JavaScript: tokens.kda.foundation.spacing.n40
12rem
kda.foundation.spacing.n48
Value: 12rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n48)
JavaScript: tokens.kda.foundation.spacing.n48
1.25rem
kda.foundation.spacing.n5
Value: 1.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n5)
JavaScript: tokens.kda.foundation.spacing.n5
14rem
kda.foundation.spacing.n56
Value: 14rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n56)
JavaScript: tokens.kda.foundation.spacing.n56
1.5rem
kda.foundation.spacing.n6
Value: 1.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n6)
JavaScript: tokens.kda.foundation.spacing.n6
16rem
kda.foundation.spacing.n64
Value: 16rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n64)
JavaScript: tokens.kda.foundation.spacing.n64
1.75rem
kda.foundation.spacing.n7
Value: 1.75rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n7)
JavaScript: tokens.kda.foundation.spacing.n7
2rem
kda.foundation.spacing.n8
Value: 2rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n8)
JavaScript: tokens.kda.foundation.spacing.n8
2.25rem
kda.foundation.spacing.n9
Value: 2.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-n9)
JavaScript: tokens.kda.foundation.spacing.n9
0px
kda.foundation.spacing.no
Value: 0px
Usage Examples
CSS Variable: var(--kda-foundation-spacing-no)
JavaScript: tokens.kda.foundation.spacing.no
0.5rem
kda.foundation.spacing.sm
Value: 0.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-sm)
JavaScript: tokens.kda.foundation.spacing.sm
1.75rem
kda.foundation.spacing.xl
Value: 1.75rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-xl)
JavaScript: tokens.kda.foundation.spacing.xl
0.25rem
kda.foundation.spacing.xs
Value: 0.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-xs)
JavaScript: tokens.kda.foundation.spacing.xs
2.25rem
kda.foundation.spacing.xxl
Value: 2.25rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-xxl)
JavaScript: tokens.kda.foundation.spacing.xxl
0.125rem
kda.foundation.spacing.xxs
Value: 0.125rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-xxs)
JavaScript: tokens.kda.foundation.spacing.xxs
2.5rem
kda.foundation.spacing.xxxl
Value: 2.5rem
Usage Examples
CSS Variable: var(--kda-foundation-spacing-xxxl)
JavaScript: tokens.kda.foundation.spacing.xxxl
4.5rem
kda.foundation.typography.fontSize.10xl
Value: 4.5rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-10xl)
JavaScript: tokens.kda.foundation.typography.fontSize.10xl
5rem
kda.foundation.typography.fontSize.11xl
Value: 5rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-11xl)
JavaScript: tokens.kda.foundation.typography.fontSize.11xl
5.25rem
kda.foundation.typography.fontSize.12xl
Value: 5.25rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-12xl)
JavaScript: tokens.kda.foundation.typography.fontSize.12xl
1.75rem
kda.foundation.typography.fontSize.2xl
Value: 1.75rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-2xl)
JavaScript: tokens.kda.foundation.typography.fontSize.2xl
2rem
kda.foundation.typography.fontSize.3xl
Value: 2rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-3xl)
JavaScript: tokens.kda.foundation.typography.fontSize.3xl
2.25rem
kda.foundation.typography.fontSize.4xl
Value: 2.25rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-4xl)
JavaScript: tokens.kda.foundation.typography.fontSize.4xl
2.5rem
kda.foundation.typography.fontSize.5xl
Value: 2.5rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-5xl)
JavaScript: tokens.kda.foundation.typography.fontSize.5xl
2.75rem
kda.foundation.typography.fontSize.6xl
Value: 2.75rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-6xl)
JavaScript: tokens.kda.foundation.typography.fontSize.6xl
3rem
kda.foundation.typography.fontSize.7xl
Value: 3rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-7xl)
JavaScript: tokens.kda.foundation.typography.fontSize.7xl
3.25rem
kda.foundation.typography.fontSize.8xl
Value: 3.25rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-8xl)
JavaScript: tokens.kda.foundation.typography.fontSize.8xl
3.75rem
kda.foundation.typography.fontSize.9xl
Value: 3.75rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-9xl)
JavaScript: tokens.kda.foundation.typography.fontSize.9xl
1rem
kda.foundation.typography.fontSize.base
Value: 1rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-base)
JavaScript: tokens.kda.foundation.typography.fontSize.base
1.25rem
kda.foundation.typography.fontSize.lg
Value: 1.25rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-lg)
JavaScript: tokens.kda.foundation.typography.fontSize.lg
1.125rem
kda.foundation.typography.fontSize.md
Value: 1.125rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-md)
JavaScript: tokens.kda.foundation.typography.fontSize.md
0.875rem
kda.foundation.typography.fontSize.sm
Value: 0.875rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-sm)
JavaScript: tokens.kda.foundation.typography.fontSize.sm
1.5rem
kda.foundation.typography.fontSize.xl
Value: 1.5rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-xl)
JavaScript: tokens.kda.foundation.typography.fontSize.xl
0.75rem
kda.foundation.typography.fontSize.xs
Value: 0.75rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-xs)
JavaScript: tokens.kda.foundation.typography.fontSize.xs
0.6875rem
kda.foundation.typography.fontSize.xxs
Value: 0.6875rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-fontSize-xxs)
JavaScript: tokens.kda.foundation.typography.fontSize.xxs
1.75rem
kda.foundation.typography.lineHeight.2xl
Value: 1.75rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-2xl)
JavaScript: tokens.kda.foundation.typography.lineHeight.2xl
2rem
kda.foundation.typography.lineHeight.3xl
Value: 2rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-3xl)
JavaScript: tokens.kda.foundation.typography.lineHeight.3xl
2.25rem
kda.foundation.typography.lineHeight.4xl
Value: 2.25rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-4xl)
JavaScript: tokens.kda.foundation.typography.lineHeight.4xl
3rem
kda.foundation.typography.lineHeight.7xl
Value: 3rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-7xl)
JavaScript: tokens.kda.foundation.typography.lineHeight.7xl
1.25rem
kda.foundation.typography.lineHeight.base
Value: 1.25rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-base)
JavaScript: tokens.kda.foundation.typography.lineHeight.base
1rem
kda.foundation.typography.lineHeight.md
Value: 1rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-md)
JavaScript: tokens.kda.foundation.typography.lineHeight.md
0.875rem
kda.foundation.typography.lineHeight.sm
Value: 0.875rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-sm)
JavaScript: tokens.kda.foundation.typography.lineHeight.sm
1.5rem
kda.foundation.typography.lineHeight.xl
Value: 1.5rem
Usage Examples
CSS Variable: var(--kda-foundation-typography-lineHeight-xl)
JavaScript: tokens.kda.foundation.typography.lineHeight.xl

⏱️ Durations 3

kda.foundation.transition.delay.none
Value: 0ms
Usage Examples
CSS Variable: var(--kda-foundation-transition-delay-none)
JavaScript: tokens.kda.foundation.transition.delay.none
kda.foundation.transition.duration.base
Value: 400ms
Usage Examples
CSS Variable: var(--kda-foundation-transition-duration-base)
JavaScript: tokens.kda.foundation.transition.duration.base
kda.foundation.transition.duration.d200
Value: 200ms
Usage Examples
CSS Variable: var(--kda-foundation-transition-duration-d200)
JavaScript: tokens.kda.foundation.transition.duration.d200

🔤 Font Families 2

Aa
kda.foundation.typography.family.monospaceFont
Value: Kode Mono
Usage Examples
CSS Variable: var(--kda-foundation-typography-family-monospaceFont)
JavaScript: tokens.kda.foundation.typography.family.monospaceFont
Aa
kda.foundation.typography.family.primaryFont
Value: Inter
Usage Examples
CSS Variable: var(--kda-foundation-typography-family-primaryFont)
JavaScript: tokens.kda.foundation.typography.family.primaryFont

💪 Font Weights 9

Aa
kda.foundation.typography.weight.monospaceFont.bold
Value: 700
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-monospaceFont-bold)
JavaScript: tokens.kda.foundation.typography.weight.monospaceFont.bold
Aa
kda.foundation.typography.weight.monospaceFont.medium
Value: 500
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-monospaceFont-medium)
JavaScript: tokens.kda.foundation.typography.weight.monospaceFont.medium
Aa
kda.foundation.typography.weight.monospaceFont.regular
Value: 400
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-monospaceFont-regular)
JavaScript: tokens.kda.foundation.typography.weight.monospaceFont.regular
Aa
kda.foundation.typography.weight.monospaceFont.semiBold
Value: 600
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-monospaceFont-semiBold)
JavaScript: tokens.kda.foundation.typography.weight.monospaceFont.semiBold
Aa
kda.foundation.typography.weight.primaryFont.bold
Value: 700
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-primaryFont-bold)
JavaScript: tokens.kda.foundation.typography.weight.primaryFont.bold
Aa
kda.foundation.typography.weight.primaryFont.light
Value: 300
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-primaryFont-light)
JavaScript: tokens.kda.foundation.typography.weight.primaryFont.light
Aa
kda.foundation.typography.weight.primaryFont.medium
Value: 500
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-primaryFont-medium)
JavaScript: tokens.kda.foundation.typography.weight.primaryFont.medium
Aa
kda.foundation.typography.weight.primaryFont.regular
Value: 400
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-primaryFont-regular)
JavaScript: tokens.kda.foundation.typography.weight.primaryFont.regular
Aa
kda.foundation.typography.weight.primaryFont.semiBold
Value: 600
Usage Examples
CSS Variable: var(--kda-foundation-typography-weight-primaryFont-semiBold)
JavaScript: tokens.kda.foundation.typography.weight.primaryFont.semiBold

🌈 Gradients 1

kda.foundation.color.gradient.base.subtle
Value: linear-gradient(180deg, #F5F5F5 25%, #f5f5f500 100%)
Usage Examples
CSS Variable: var(--kda-foundation-color-gradient-base-subtle)
JavaScript: tokens.kda.foundation.color.gradient.base.subtle

🖼️ Icon 1286

kda.foundation.icon.brand.K.rounded-filled.kdacolor_black
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-rounded-filled-kdacolor_black)
JavaScript: tokens.kda.foundation.icon.brand.K.rounded-filled.kdacolor_black
kda.foundation.icon.brand.K.rounded-filled.kdacolor_green
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-rounded-filled-kdacolor_green)
JavaScript: tokens.kda.foundation.icon.brand.K.rounded-filled.kdacolor_green
kda.foundation.icon.brand.K.rounded-filled.kdacolor_white
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-rounded-filled-kdacolor_white)
JavaScript: tokens.kda.foundation.icon.brand.K.rounded-filled.kdacolor_white
kda.foundation.icon.brand.K.rounded.kdacolor_black
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-rounded-kdacolor_black)
JavaScript: tokens.kda.foundation.icon.brand.K.rounded.kdacolor_black
kda.foundation.icon.brand.K.rounded.kdacolor_green
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-rounded-kdacolor_green)
JavaScript: tokens.kda.foundation.icon.brand.K.rounded.kdacolor_green
kda.foundation.icon.brand.K.rounded.kdacolor_white
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-rounded-kdacolor_white)
JavaScript: tokens.kda.foundation.icon.brand.K.rounded.kdacolor_white
kda.foundation.icon.brand.K.square.kdacolor_black
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-square-kdacolor_black)
JavaScript: tokens.kda.foundation.icon.brand.K.square.kdacolor_black
kda.foundation.icon.brand.K.square.kdacolor_green
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-square-kdacolor_green)
JavaScript: tokens.kda.foundation.icon.brand.K.square.kdacolor_green
kda.foundation.icon.brand.K.square.kdacolor_white
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-K-square-kdacolor_white)
JavaScript: tokens.kda.foundation.icon.brand.K.square.kdacolor_white
kda.foundation.icon.brand.logo.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-logo-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.brand.logo.kdacolor_dark
kda.foundation.icon.brand.logo.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-brand-logo-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.brand.logo.kdacolor_light
kda.foundation.icon.product.chainweaver.alpha.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-chainweaver-alpha-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.chainweaver.alpha.kdacolor_dark
kda.foundation.icon.product.chainweaver.alpha.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-chainweaver-alpha-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.chainweaver.alpha.kdacolor_light
kda.foundation.icon.product.chainweaver.alpha.logo.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-chainweaver-alpha-logo-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.chainweaver.alpha.logo.kdacolor_dark
kda.foundation.icon.product.chainweaver.alpha.logo.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-chainweaver-alpha-logo-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.chainweaver.alpha.logo.kdacolor_light
kda.foundation.icon.product.chainweaver.alpha.rounded.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-chainweaver-alpha-rounded-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.chainweaver.alpha.rounded.kdacolor_dark
kda.foundation.icon.product.chainweaver.alpha.rounded.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-chainweaver-alpha-rounded-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.chainweaver.alpha.rounded.kdacolor_light
kda.foundation.icon.product.docs.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-docs-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.docs.kdacolor_dark
kda.foundation.icon.product.docs.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-docs-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.docs.kdacolor_light
kda.foundation.icon.product.explorer.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-explorer-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.explorer.kdacolor_dark
kda.foundation.icon.product.explorer.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-explorer-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.explorer.kdacolor_light
kda.foundation.icon.product.kodeDesignSystem.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-kodeDesignSystem-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.kodeDesignSystem.kdacolor_dark
kda.foundation.icon.product.kodeDesignSystem.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-kodeDesignSystem-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.kodeDesignSystem.kdacolor_light
kda.foundation.icon.product.marmaladeV2.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-marmaladeV2-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.marmaladeV2.kdacolor_dark
kda.foundation.icon.product.marmaladeV2.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-marmaladeV2-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.marmaladeV2.kdacolor_light
kda.foundation.icon.product.proofOfUs.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-proofOfUs-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.proofOfUs.kdacolor_dark
kda.foundation.icon.product.proofOfUs.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-proofOfUs-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.proofOfUs.kdacolor_light
kda.foundation.icon.product.tools.kdacolor_dark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-tools-kdacolor_dark)
JavaScript: tokens.kda.foundation.icon.product.tools.kdacolor_dark
kda.foundation.icon.product.tools.kdacolor_light
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-product-tools-kdacolor_light)
JavaScript: tokens.kda.foundation.icon.product.tools.kdacolor_light
kda.foundation.icon.system.mono_123
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_123)
JavaScript: tokens.kda.foundation.icon.system.mono_123
kda.foundation.icon.system.mono_360
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_360)
JavaScript: tokens.kda.foundation.icon.system.mono_360
kda.foundation.icon.system.mono_3p
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_3p)
JavaScript: tokens.kda.foundation.icon.system.mono_3p
kda.foundation.icon.system.mono_6_ft_apart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_6_ft_apart)
JavaScript: tokens.kda.foundation.icon.system.mono_6_ft_apart
kda.foundation.icon.system.mono_abc
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_abc)
JavaScript: tokens.kda.foundation.icon.system.mono_abc
kda.foundation.icon.system.mono_access_alarm
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_access_alarm)
JavaScript: tokens.kda.foundation.icon.system.mono_access_alarm
kda.foundation.icon.system.mono_access_time
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_access_time)
JavaScript: tokens.kda.foundation.icon.system.mono_access_time
kda.foundation.icon.system.mono_access_time_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_access_time_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_access_time_filled
kda.foundation.icon.system.mono_accessibility_new
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_accessibility_new)
JavaScript: tokens.kda.foundation.icon.system.mono_accessibility_new
kda.foundation.icon.system.mono_accessible
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_accessible)
JavaScript: tokens.kda.foundation.icon.system.mono_accessible
kda.foundation.icon.system.mono_account_balance
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_account_balance)
JavaScript: tokens.kda.foundation.icon.system.mono_account_balance
kda.foundation.icon.system.mono_account_balance_wallet
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_account_balance_wallet)
JavaScript: tokens.kda.foundation.icon.system.mono_account_balance_wallet
kda.foundation.icon.system.mono_account_box
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_account_box)
JavaScript: tokens.kda.foundation.icon.system.mono_account_box
kda.foundation.icon.system.mono_account_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_account_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_account_circle
kda.foundation.icon.system.mono_account_tree
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_account_tree)
JavaScript: tokens.kda.foundation.icon.system.mono_account_tree
kda.foundation.icon.system.mono_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add)
JavaScript: tokens.kda.foundation.icon.system.mono_add
kda.foundation.icon.system.mono_add_a_photo
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_a_photo)
JavaScript: tokens.kda.foundation.icon.system.mono_add_a_photo
kda.foundation.icon.system.mono_add_alarm
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_alarm)
JavaScript: tokens.kda.foundation.icon.system.mono_add_alarm
kda.foundation.icon.system.mono_add_box
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_box)
JavaScript: tokens.kda.foundation.icon.system.mono_add_box
kda.foundation.icon.system.mono_add_business
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_business)
JavaScript: tokens.kda.foundation.icon.system.mono_add_business
kda.foundation.icon.system.mono_add_card
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_card)
JavaScript: tokens.kda.foundation.icon.system.mono_add_card
kda.foundation.icon.system.mono_add_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_add_chart
kda.foundation.icon.system.mono_add_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_add_circle
kda.foundation.icon.system.mono_add_circle_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_circle_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_add_circle_outline
kda.foundation.icon.system.mono_add_comment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_comment)
JavaScript: tokens.kda.foundation.icon.system.mono_add_comment
kda.foundation.icon.system.mono_add_home
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_home)
JavaScript: tokens.kda.foundation.icon.system.mono_add_home
kda.foundation.icon.system.mono_add_home_work
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_home_work)
JavaScript: tokens.kda.foundation.icon.system.mono_add_home_work
kda.foundation.icon.system.mono_add_ic_call
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_ic_call)
JavaScript: tokens.kda.foundation.icon.system.mono_add_ic_call
kda.foundation.icon.system.mono_add_link
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_link)
JavaScript: tokens.kda.foundation.icon.system.mono_add_link
kda.foundation.icon.system.mono_add_location
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_location)
JavaScript: tokens.kda.foundation.icon.system.mono_add_location
kda.foundation.icon.system.mono_add_location_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_location_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_add_location_alt
kda.foundation.icon.system.mono_add_moderator
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_moderator)
JavaScript: tokens.kda.foundation.icon.system.mono_add_moderator
kda.foundation.icon.system.mono_add_photo_alternate
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_photo_alternate)
JavaScript: tokens.kda.foundation.icon.system.mono_add_photo_alternate
kda.foundation.icon.system.mono_add_reaction
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_reaction)
JavaScript: tokens.kda.foundation.icon.system.mono_add_reaction
kda.foundation.icon.system.mono_add_road
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_road)
JavaScript: tokens.kda.foundation.icon.system.mono_add_road
kda.foundation.icon.system.mono_add_shopping_cart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_shopping_cart)
JavaScript: tokens.kda.foundation.icon.system.mono_add_shopping_cart
kda.foundation.icon.system.mono_add_task
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_task)
JavaScript: tokens.kda.foundation.icon.system.mono_add_task
kda.foundation.icon.system.mono_add_to_photos
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_to_photos)
JavaScript: tokens.kda.foundation.icon.system.mono_add_to_photos
kda.foundation.icon.system.mono_add_to_queue
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_add_to_queue)
JavaScript: tokens.kda.foundation.icon.system.mono_add_to_queue
kda.foundation.icon.system.mono_adf_scanner
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_adf_scanner)
JavaScript: tokens.kda.foundation.icon.system.mono_adf_scanner
kda.foundation.icon.system.mono_admin_panel_settings
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_admin_panel_settings)
JavaScript: tokens.kda.foundation.icon.system.mono_admin_panel_settings
kda.foundation.icon.system.mono_ads_click
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_ads_click)
JavaScript: tokens.kda.foundation.icon.system.mono_ads_click
kda.foundation.icon.system.mono_airline_seat_individual_suite
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_airline_seat_individual_suite)
JavaScript: tokens.kda.foundation.icon.system.mono_airline_seat_individual_suite
kda.foundation.icon.system.mono_airline_seat_recline_extra
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_airline_seat_recline_extra)
JavaScript: tokens.kda.foundation.icon.system.mono_airline_seat_recline_extra
kda.foundation.icon.system.mono_airline_stops
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_airline_stops)
JavaScript: tokens.kda.foundation.icon.system.mono_airline_stops
kda.foundation.icon.system.mono_airplane_ticket
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_airplane_ticket)
JavaScript: tokens.kda.foundation.icon.system.mono_airplane_ticket
kda.foundation.icon.system.mono_airplanemode_active
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_airplanemode_active)
JavaScript: tokens.kda.foundation.icon.system.mono_airplanemode_active
kda.foundation.icon.system.mono_airplanemode_inactive
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_airplanemode_inactive)
JavaScript: tokens.kda.foundation.icon.system.mono_airplanemode_inactive
kda.foundation.icon.system.mono_airplay
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_airplay)
JavaScript: tokens.kda.foundation.icon.system.mono_airplay
kda.foundation.icon.system.mono_alarm_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_alarm_add)
JavaScript: tokens.kda.foundation.icon.system.mono_alarm_add
kda.foundation.icon.system.mono_alarm_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_alarm_off)
JavaScript: tokens.kda.foundation.icon.system.mono_alarm_off
kda.foundation.icon.system.mono_alarm_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_alarm_on)
JavaScript: tokens.kda.foundation.icon.system.mono_alarm_on
kda.foundation.icon.system.mono_align_horizontal_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_align_horizontal_left)
JavaScript: tokens.kda.foundation.icon.system.mono_align_horizontal_left
kda.foundation.icon.system.mono_align_horizontal_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_align_horizontal_right)
JavaScript: tokens.kda.foundation.icon.system.mono_align_horizontal_right
kda.foundation.icon.system.mono_align_vertical_bottom
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_align_vertical_bottom)
JavaScript: tokens.kda.foundation.icon.system.mono_align_vertical_bottom
kda.foundation.icon.system.mono_align_vertical_center
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_align_vertical_center)
JavaScript: tokens.kda.foundation.icon.system.mono_align_vertical_center
kda.foundation.icon.system.mono_align_vertical_top
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_align_vertical_top)
JavaScript: tokens.kda.foundation.icon.system.mono_align_vertical_top
kda.foundation.icon.system.mono_all_inbox
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_all_inbox)
JavaScript: tokens.kda.foundation.icon.system.mono_all_inbox
kda.foundation.icon.system.mono_all_inclusive
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_all_inclusive)
JavaScript: tokens.kda.foundation.icon.system.mono_all_inclusive
kda.foundation.icon.system.mono_alt_route
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_alt_route)
JavaScript: tokens.kda.foundation.icon.system.mono_alt_route
kda.foundation.icon.system.mono_alternate_email
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_alternate_email)
JavaScript: tokens.kda.foundation.icon.system.mono_alternate_email
kda.foundation.icon.system.mono_analytics
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_analytics)
JavaScript: tokens.kda.foundation.icon.system.mono_analytics
kda.foundation.icon.system.mono_animation
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_animation)
JavaScript: tokens.kda.foundation.icon.system.mono_animation
kda.foundation.icon.system.mono_announcement
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_announcement)
JavaScript: tokens.kda.foundation.icon.system.mono_announcement
kda.foundation.icon.system.mono_apartment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_apartment)
JavaScript: tokens.kda.foundation.icon.system.mono_apartment
kda.foundation.icon.system.mono_app_registration
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_app_registration)
JavaScript: tokens.kda.foundation.icon.system.mono_app_registration
kda.foundation.icon.system.mono_app_settings_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_app_settings_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_app_settings_alt
kda.foundation.icon.system.mono_app_shortcut
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_app_shortcut)
JavaScript: tokens.kda.foundation.icon.system.mono_app_shortcut
kda.foundation.icon.system.mono_approval
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_approval)
JavaScript: tokens.kda.foundation.icon.system.mono_approval
kda.foundation.icon.system.mono_apps
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_apps)
JavaScript: tokens.kda.foundation.icon.system.mono_apps
kda.foundation.icon.system.mono_archive
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_archive)
JavaScript: tokens.kda.foundation.icon.system.mono_archive
kda.foundation.icon.system.mono_area_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_area_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_area_chart
kda.foundation.icon.system.mono_arrow_back
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_back)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_back
kda.foundation.icon.system.mono_arrow_back_ios
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_back_ios)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_back_ios
kda.foundation.icon.system.mono_arrow_back_ios_new
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_back_ios_new)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_back_ios_new
kda.foundation.icon.system.mono_arrow_circle_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_circle_down)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_circle_down
kda.foundation.icon.system.mono_arrow_circle_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_circle_left)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_circle_left
kda.foundation.icon.system.mono_arrow_circle_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_circle_right)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_circle_right
kda.foundation.icon.system.mono_arrow_circle_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_circle_up)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_circle_up
kda.foundation.icon.system.mono_arrow_downward
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_downward)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_downward
kda.foundation.icon.system.mono_arrow_drop_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_drop_down)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_drop_down
kda.foundation.icon.system.mono_arrow_drop_down_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_drop_down_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_drop_down_circle
kda.foundation.icon.system.mono_arrow_drop_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_drop_up)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_drop_up
kda.foundation.icon.system.mono_arrow_forward
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_forward)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_forward
kda.foundation.icon.system.mono_arrow_forward_ios
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_forward_ios)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_forward_ios
kda.foundation.icon.system.mono_arrow_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_left)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_left
kda.foundation.icon.system.mono_arrow_outward
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_outward)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_outward
kda.foundation.icon.system.mono_arrow_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_right)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_right
kda.foundation.icon.system.mono_arrow_right_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_right_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_right_alt
kda.foundation.icon.system.mono_arrow_upward
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_arrow_upward)
JavaScript: tokens.kda.foundation.icon.system.mono_arrow_upward
kda.foundation.icon.system.mono_art_track
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_art_track)
JavaScript: tokens.kda.foundation.icon.system.mono_art_track
kda.foundation.icon.system.mono_article
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_article)
JavaScript: tokens.kda.foundation.icon.system.mono_article
kda.foundation.icon.system.mono_aspect_ratio
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_aspect_ratio)
JavaScript: tokens.kda.foundation.icon.system.mono_aspect_ratio
kda.foundation.icon.system.mono_assessment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assessment)
JavaScript: tokens.kda.foundation.icon.system.mono_assessment
kda.foundation.icon.system.mono_assignment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assignment)
JavaScript: tokens.kda.foundation.icon.system.mono_assignment
kda.foundation.icon.system.mono_assignment_ind
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assignment_ind)
JavaScript: tokens.kda.foundation.icon.system.mono_assignment_ind
kda.foundation.icon.system.mono_assignment_late
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assignment_late)
JavaScript: tokens.kda.foundation.icon.system.mono_assignment_late
kda.foundation.icon.system.mono_assignment_return
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assignment_return)
JavaScript: tokens.kda.foundation.icon.system.mono_assignment_return
kda.foundation.icon.system.mono_assignment_returned
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assignment_returned)
JavaScript: tokens.kda.foundation.icon.system.mono_assignment_returned
kda.foundation.icon.system.mono_assignment_turned_in
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assignment_turned_in)
JavaScript: tokens.kda.foundation.icon.system.mono_assignment_turned_in
kda.foundation.icon.system.mono_assistant
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assistant)
JavaScript: tokens.kda.foundation.icon.system.mono_assistant
kda.foundation.icon.system.mono_assistant_direction
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assistant_direction)
JavaScript: tokens.kda.foundation.icon.system.mono_assistant_direction
kda.foundation.icon.system.mono_assistant_photo
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assistant_photo)
JavaScript: tokens.kda.foundation.icon.system.mono_assistant_photo
kda.foundation.icon.system.mono_assured_workload
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_assured_workload)
JavaScript: tokens.kda.foundation.icon.system.mono_assured_workload
kda.foundation.icon.system.mono_atm
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_atm)
JavaScript: tokens.kda.foundation.icon.system.mono_atm
kda.foundation.icon.system.mono_attach_file
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_attach_file)
JavaScript: tokens.kda.foundation.icon.system.mono_attach_file
kda.foundation.icon.system.mono_attach_money
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_attach_money)
JavaScript: tokens.kda.foundation.icon.system.mono_attach_money
kda.foundation.icon.system.mono_attachment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_attachment)
JavaScript: tokens.kda.foundation.icon.system.mono_attachment
kda.foundation.icon.system.mono_attribution
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_attribution)
JavaScript: tokens.kda.foundation.icon.system.mono_attribution
kda.foundation.icon.system.mono_audio_file
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_audio_file)
JavaScript: tokens.kda.foundation.icon.system.mono_audio_file
kda.foundation.icon.system.mono_audiotrack
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_audiotrack)
JavaScript: tokens.kda.foundation.icon.system.mono_audiotrack
kda.foundation.icon.system.mono_auto_awesome
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_auto_awesome)
JavaScript: tokens.kda.foundation.icon.system.mono_auto_awesome
kda.foundation.icon.system.mono_auto_awesome_motion
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_auto_awesome_motion)
JavaScript: tokens.kda.foundation.icon.system.mono_auto_awesome_motion
kda.foundation.icon.system.mono_auto_delete
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_auto_delete)
JavaScript: tokens.kda.foundation.icon.system.mono_auto_delete
kda.foundation.icon.system.mono_auto_fix_high
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_auto_fix_high)
JavaScript: tokens.kda.foundation.icon.system.mono_auto_fix_high
kda.foundation.icon.system.mono_auto_graph
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_auto_graph)
JavaScript: tokens.kda.foundation.icon.system.mono_auto_graph
kda.foundation.icon.system.mono_auto_mode
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_auto_mode)
JavaScript: tokens.kda.foundation.icon.system.mono_auto_mode
kda.foundation.icon.system.mono_auto_stories
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_auto_stories)
JavaScript: tokens.kda.foundation.icon.system.mono_auto_stories
kda.foundation.icon.system.mono_autofps_select
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_autofps_select)
JavaScript: tokens.kda.foundation.icon.system.mono_autofps_select
kda.foundation.icon.system.mono_autorenew
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_autorenew)
JavaScript: tokens.kda.foundation.icon.system.mono_autorenew
kda.foundation.icon.system.mono_av_timer
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_av_timer)
JavaScript: tokens.kda.foundation.icon.system.mono_av_timer
kda.foundation.icon.system.mono_back_hand
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_back_hand)
JavaScript: tokens.kda.foundation.icon.system.mono_back_hand
kda.foundation.icon.system.mono_backspace
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_backspace)
JavaScript: tokens.kda.foundation.icon.system.mono_backspace
kda.foundation.icon.system.mono_backup
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_backup)
JavaScript: tokens.kda.foundation.icon.system.mono_backup
kda.foundation.icon.system.mono_backup_table
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_backup_table)
JavaScript: tokens.kda.foundation.icon.system.mono_backup_table
kda.foundation.icon.system.mono_badge
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_badge)
JavaScript: tokens.kda.foundation.icon.system.mono_badge
kda.foundation.icon.system.mono_ballot
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_ballot)
JavaScript: tokens.kda.foundation.icon.system.mono_ballot
kda.foundation.icon.system.mono_bar_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bar_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_bar_chart
kda.foundation.icon.system.mono_battery_0_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_0_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_0_bar
kda.foundation.icon.system.mono_battery_1_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_1_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_1_bar
kda.foundation.icon.system.mono_battery_2_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_2_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_2_bar
kda.foundation.icon.system.mono_battery_3_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_3_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_3_bar
kda.foundation.icon.system.mono_battery_4_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_4_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_4_bar
kda.foundation.icon.system.mono_battery_5_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_5_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_5_bar
kda.foundation.icon.system.mono_battery_6_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_6_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_6_bar
kda.foundation.icon.system.mono_battery_alert
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_alert)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_alert
kda.foundation.icon.system.mono_battery_charging_full
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_charging_full)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_charging_full
kda.foundation.icon.system.mono_battery_full
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_full)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_full
kda.foundation.icon.system.mono_battery_saver
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_saver)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_saver
kda.foundation.icon.system.mono_battery_std
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_std)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_std
kda.foundation.icon.system.mono_battery_unknown
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_battery_unknown)
JavaScript: tokens.kda.foundation.icon.system.mono_battery_unknown
kda.foundation.icon.system.mono_bedtime
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bedtime)
JavaScript: tokens.kda.foundation.icon.system.mono_bedtime
kda.foundation.icon.system.mono_beenhere
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_beenhere)
JavaScript: tokens.kda.foundation.icon.system.mono_beenhere
kda.foundation.icon.system.mono_block
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_block)
JavaScript: tokens.kda.foundation.icon.system.mono_block
kda.foundation.icon.system.mono_bluetooth
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bluetooth)
JavaScript: tokens.kda.foundation.icon.system.mono_bluetooth
kda.foundation.icon.system.mono_bluetooth_audio
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bluetooth_audio)
JavaScript: tokens.kda.foundation.icon.system.mono_bluetooth_audio
kda.foundation.icon.system.mono_bluetooth_connected
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bluetooth_connected)
JavaScript: tokens.kda.foundation.icon.system.mono_bluetooth_connected
kda.foundation.icon.system.mono_bluetooth_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bluetooth_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_bluetooth_disabled
kda.foundation.icon.system.mono_bolt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bolt)
JavaScript: tokens.kda.foundation.icon.system.mono_bolt
kda.foundation.icon.system.mono_bookmark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bookmark)
JavaScript: tokens.kda.foundation.icon.system.mono_bookmark
kda.foundation.icon.system.mono_bookmark_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bookmark_add)
JavaScript: tokens.kda.foundation.icon.system.mono_bookmark_add
kda.foundation.icon.system.mono_bookmark_added
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bookmark_added)
JavaScript: tokens.kda.foundation.icon.system.mono_bookmark_added
kda.foundation.icon.system.mono_bookmark_border
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bookmark_border)
JavaScript: tokens.kda.foundation.icon.system.mono_bookmark_border
kda.foundation.icon.system.mono_bookmark_remove
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bookmark_remove)
JavaScript: tokens.kda.foundation.icon.system.mono_bookmark_remove
kda.foundation.icon.system.mono_bookmarks
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bookmarks)
JavaScript: tokens.kda.foundation.icon.system.mono_bookmarks
kda.foundation.icon.system.mono_border_all
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_all)
JavaScript: tokens.kda.foundation.icon.system.mono_border_all
kda.foundation.icon.system.mono_border_bottom
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_bottom)
JavaScript: tokens.kda.foundation.icon.system.mono_border_bottom
kda.foundation.icon.system.mono_border_clear
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_clear)
JavaScript: tokens.kda.foundation.icon.system.mono_border_clear
kda.foundation.icon.system.mono_border_color
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_color)
JavaScript: tokens.kda.foundation.icon.system.mono_border_color
kda.foundation.icon.system.mono_border_horizontal
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_horizontal)
JavaScript: tokens.kda.foundation.icon.system.mono_border_horizontal
kda.foundation.icon.system.mono_border_inner
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_inner)
JavaScript: tokens.kda.foundation.icon.system.mono_border_inner
kda.foundation.icon.system.mono_border_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_left)
JavaScript: tokens.kda.foundation.icon.system.mono_border_left
kda.foundation.icon.system.mono_border_outer
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_outer)
JavaScript: tokens.kda.foundation.icon.system.mono_border_outer
kda.foundation.icon.system.mono_border_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_right)
JavaScript: tokens.kda.foundation.icon.system.mono_border_right
kda.foundation.icon.system.mono_border_style
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_style)
JavaScript: tokens.kda.foundation.icon.system.mono_border_style
kda.foundation.icon.system.mono_border_top
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_top)
JavaScript: tokens.kda.foundation.icon.system.mono_border_top
kda.foundation.icon.system.mono_border_vertical
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_border_vertical)
JavaScript: tokens.kda.foundation.icon.system.mono_border_vertical
kda.foundation.icon.system.mono_branding_watermark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_branding_watermark)
JavaScript: tokens.kda.foundation.icon.system.mono_branding_watermark
kda.foundation.icon.system.mono_brightness_1
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_1)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_1
kda.foundation.icon.system.mono_brightness_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_2)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_2
kda.foundation.icon.system.mono_brightness_3
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_3)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_3
kda.foundation.icon.system.mono_brightness_4
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_4)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_4
kda.foundation.icon.system.mono_brightness_5
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_5)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_5
kda.foundation.icon.system.mono_brightness_6
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_6)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_6
kda.foundation.icon.system.mono_brightness_7
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_7)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_7
kda.foundation.icon.system.mono_brightness_auto
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_auto)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_auto
kda.foundation.icon.system.mono_brightness_high
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_high)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_high
kda.foundation.icon.system.mono_brightness_low
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_low)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_low
kda.foundation.icon.system.mono_brightness_medium
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brightness_medium)
JavaScript: tokens.kda.foundation.icon.system.mono_brightness_medium
kda.foundation.icon.system.mono_browse_gallery
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_browse_gallery)
JavaScript: tokens.kda.foundation.icon.system.mono_browse_gallery
kda.foundation.icon.system.mono_browser_updated
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_browser_updated)
JavaScript: tokens.kda.foundation.icon.system.mono_browser_updated
kda.foundation.icon.system.mono_brush
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_brush)
JavaScript: tokens.kda.foundation.icon.system.mono_brush
kda.foundation.icon.system.mono_bug_report
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_bug_report)
JavaScript: tokens.kda.foundation.icon.system.mono_bug_report
kda.foundation.icon.system.mono_build
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_build)
JavaScript: tokens.kda.foundation.icon.system.mono_build
kda.foundation.icon.system.mono_build_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_build_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_build_circle
kda.foundation.icon.system.mono_burst_mode
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_burst_mode)
JavaScript: tokens.kda.foundation.icon.system.mono_burst_mode
kda.foundation.icon.system.mono_business
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_business)
JavaScript: tokens.kda.foundation.icon.system.mono_business
kda.foundation.icon.system.mono_business_center
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_business_center)
JavaScript: tokens.kda.foundation.icon.system.mono_business_center
kda.foundation.icon.system.mono_c_account
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_c_account)
JavaScript: tokens.kda.foundation.icon.system.mono_c_account
kda.foundation.icon.system.mono_cable
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cable)
JavaScript: tokens.kda.foundation.icon.system.mono_cable
kda.foundation.icon.system.mono_cached
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cached)
JavaScript: tokens.kda.foundation.icon.system.mono_cached
kda.foundation.icon.system.mono_cake
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cake)
JavaScript: tokens.kda.foundation.icon.system.mono_cake
kda.foundation.icon.system.mono_calculate
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_calculate)
JavaScript: tokens.kda.foundation.icon.system.mono_calculate
kda.foundation.icon.system.mono_calendar_month
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_calendar_month)
JavaScript: tokens.kda.foundation.icon.system.mono_calendar_month
kda.foundation.icon.system.mono_call_made
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_call_made)
JavaScript: tokens.kda.foundation.icon.system.mono_call_made
kda.foundation.icon.system.mono_call_merge
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_call_merge)
JavaScript: tokens.kda.foundation.icon.system.mono_call_merge
kda.foundation.icon.system.mono_call_missed
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_call_missed)
JavaScript: tokens.kda.foundation.icon.system.mono_call_missed
kda.foundation.icon.system.mono_call_missed_outgoing
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_call_missed_outgoing)
JavaScript: tokens.kda.foundation.icon.system.mono_call_missed_outgoing
kda.foundation.icon.system.mono_call_split
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_call_split)
JavaScript: tokens.kda.foundation.icon.system.mono_call_split
kda.foundation.icon.system.mono_call_to_action
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_call_to_action)
JavaScript: tokens.kda.foundation.icon.system.mono_call_to_action
kda.foundation.icon.system.mono_camera_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_camera_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_camera_alt
kda.foundation.icon.system.mono_camera_enhance
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_camera_enhance)
JavaScript: tokens.kda.foundation.icon.system.mono_camera_enhance
kda.foundation.icon.system.mono_camera_front
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_camera_front)
JavaScript: tokens.kda.foundation.icon.system.mono_camera_front
kda.foundation.icon.system.mono_camera_rear
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_camera_rear)
JavaScript: tokens.kda.foundation.icon.system.mono_camera_rear
kda.foundation.icon.system.mono_camera_roll
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_camera_roll)
JavaScript: tokens.kda.foundation.icon.system.mono_camera_roll
kda.foundation.icon.system.mono_cancel
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cancel)
JavaScript: tokens.kda.foundation.icon.system.mono_cancel
kda.foundation.icon.system.mono_candlestick_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_candlestick_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_candlestick_chart
kda.foundation.icon.system.mono_card_giftcard
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_card_giftcard)
JavaScript: tokens.kda.foundation.icon.system.mono_card_giftcard
kda.foundation.icon.system.mono_card_travel
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_card_travel)
JavaScript: tokens.kda.foundation.icon.system.mono_card_travel
kda.foundation.icon.system.mono_cell_tower
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cell_tower)
JavaScript: tokens.kda.foundation.icon.system.mono_cell_tower
kda.foundation.icon.system.mono_cell_wifi
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cell_wifi)
JavaScript: tokens.kda.foundation.icon.system.mono_cell_wifi
kda.foundation.icon.system.mono_center_focus_strong
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_center_focus_strong)
JavaScript: tokens.kda.foundation.icon.system.mono_center_focus_strong
kda.foundation.icon.system.mono_change_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_change_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_change_circle
kda.foundation.icon.system.mono_change_history
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_change_history)
JavaScript: tokens.kda.foundation.icon.system.mono_change_history
kda.foundation.icon.system.mono_chat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_chat)
JavaScript: tokens.kda.foundation.icon.system.mono_chat
kda.foundation.icon.system.mono_chat_bubble
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_chat_bubble)
JavaScript: tokens.kda.foundation.icon.system.mono_chat_bubble
kda.foundation.icon.system.mono_chat_bubble_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_chat_bubble_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_chat_bubble_outline
kda.foundation.icon.system.mono_check
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_check)
JavaScript: tokens.kda.foundation.icon.system.mono_check
kda.foundation.icon.system.mono_check_box
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_check_box)
JavaScript: tokens.kda.foundation.icon.system.mono_check_box
kda.foundation.icon.system.mono_check_box_outline_blank
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_check_box_outline_blank)
JavaScript: tokens.kda.foundation.icon.system.mono_check_box_outline_blank
kda.foundation.icon.system.mono_check_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_check_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_check_circle
kda.foundation.icon.system.mono_check_circle_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_check_circle_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_check_circle_outline
kda.foundation.icon.system.mono_checklist
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_checklist)
JavaScript: tokens.kda.foundation.icon.system.mono_checklist
kda.foundation.icon.system.mono_checklist_rtl
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_checklist_rtl)
JavaScript: tokens.kda.foundation.icon.system.mono_checklist_rtl
kda.foundation.icon.system.mono_chevron_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_chevron_left)
JavaScript: tokens.kda.foundation.icon.system.mono_chevron_left
kda.foundation.icon.system.mono_chevron_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_chevron_right)
JavaScript: tokens.kda.foundation.icon.system.mono_chevron_right
kda.foundation.icon.system.mono_chrome_reader_mode
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_chrome_reader_mode)
JavaScript: tokens.kda.foundation.icon.system.mono_chrome_reader_mode
kda.foundation.icon.system.mono_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_circle
kda.foundation.icon.system.mono_circle_notifications
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_circle_notifications)
JavaScript: tokens.kda.foundation.icon.system.mono_circle_notifications
kda.foundation.icon.system.mono_class
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_class)
JavaScript: tokens.kda.foundation.icon.system.mono_class
kda.foundation.icon.system.mono_clear
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_clear)
JavaScript: tokens.kda.foundation.icon.system.mono_clear
kda.foundation.icon.system.mono_clear_all
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_clear_all)
JavaScript: tokens.kda.foundation.icon.system.mono_clear_all
kda.foundation.icon.system.mono_close
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_close)
JavaScript: tokens.kda.foundation.icon.system.mono_close
kda.foundation.icon.system.mono_close_fullscreen
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_close_fullscreen)
JavaScript: tokens.kda.foundation.icon.system.mono_close_fullscreen
kda.foundation.icon.system.mono_closed_caption
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_closed_caption)
JavaScript: tokens.kda.foundation.icon.system.mono_closed_caption
kda.foundation.icon.system.mono_closed_caption_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_closed_caption_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_closed_caption_disabled
kda.foundation.icon.system.mono_closed_caption_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_closed_caption_off)
JavaScript: tokens.kda.foundation.icon.system.mono_closed_caption_off
kda.foundation.icon.system.mono_cloud
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud
kda.foundation.icon.system.mono_cloud_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud_circle
kda.foundation.icon.system.mono_cloud_done
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud_done)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud_done
kda.foundation.icon.system.mono_cloud_download
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud_download)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud_download
kda.foundation.icon.system.mono_cloud_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud_off)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud_off
kda.foundation.icon.system.mono_cloud_queue
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud_queue)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud_queue
kda.foundation.icon.system.mono_cloud_sync
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud_sync)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud_sync
kda.foundation.icon.system.mono_cloud_upload
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cloud_upload)
JavaScript: tokens.kda.foundation.icon.system.mono_cloud_upload
kda.foundation.icon.system.mono_co_present
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_co_present)
JavaScript: tokens.kda.foundation.icon.system.mono_co_present
kda.foundation.icon.system.mono_code
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_code)
JavaScript: tokens.kda.foundation.icon.system.mono_code
kda.foundation.icon.system.mono_code_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_code_off)
JavaScript: tokens.kda.foundation.icon.system.mono_code_off
kda.foundation.icon.system.mono_collections
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_collections)
JavaScript: tokens.kda.foundation.icon.system.mono_collections
kda.foundation.icon.system.mono_color_lens
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_color_lens)
JavaScript: tokens.kda.foundation.icon.system.mono_color_lens
kda.foundation.icon.system.mono_colorize
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_colorize)
JavaScript: tokens.kda.foundation.icon.system.mono_colorize
kda.foundation.icon.system.mono_comment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_comment)
JavaScript: tokens.kda.foundation.icon.system.mono_comment
kda.foundation.icon.system.mono_comment_bank
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_comment_bank)
JavaScript: tokens.kda.foundation.icon.system.mono_comment_bank
kda.foundation.icon.system.mono_comments_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_comments_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_comments_disabled
kda.foundation.icon.system.mono_commit
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_commit)
JavaScript: tokens.kda.foundation.icon.system.mono_commit
kda.foundation.icon.system.mono_compare
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_compare)
JavaScript: tokens.kda.foundation.icon.system.mono_compare
kda.foundation.icon.system.mono_compare_arrows
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_compare_arrows)
JavaScript: tokens.kda.foundation.icon.system.mono_compare_arrows
kda.foundation.icon.system.mono_compress
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_compress)
JavaScript: tokens.kda.foundation.icon.system.mono_compress
kda.foundation.icon.system.mono_computer
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_computer)
JavaScript: tokens.kda.foundation.icon.system.mono_computer
kda.foundation.icon.system.mono_construction
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_construction)
JavaScript: tokens.kda.foundation.icon.system.mono_construction
kda.foundation.icon.system.mono_contact_emergency
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contact_emergency)
JavaScript: tokens.kda.foundation.icon.system.mono_contact_emergency
kda.foundation.icon.system.mono_contact_mail
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contact_mail)
JavaScript: tokens.kda.foundation.icon.system.mono_contact_mail
kda.foundation.icon.system.mono_contact_page
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contact_page)
JavaScript: tokens.kda.foundation.icon.system.mono_contact_page
kda.foundation.icon.system.mono_contact_phone
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contact_phone)
JavaScript: tokens.kda.foundation.icon.system.mono_contact_phone
kda.foundation.icon.system.mono_contact_support
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contact_support)
JavaScript: tokens.kda.foundation.icon.system.mono_contact_support
kda.foundation.icon.system.mono_contactless
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contactless)
JavaScript: tokens.kda.foundation.icon.system.mono_contactless
kda.foundation.icon.system.mono_contacts
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contacts)
JavaScript: tokens.kda.foundation.icon.system.mono_contacts
kda.foundation.icon.system.mono_content_copy
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_content_copy)
JavaScript: tokens.kda.foundation.icon.system.mono_content_copy
kda.foundation.icon.system.mono_content_cut
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_content_cut)
JavaScript: tokens.kda.foundation.icon.system.mono_content_cut
kda.foundation.icon.system.mono_content_paste
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_content_paste)
JavaScript: tokens.kda.foundation.icon.system.mono_content_paste
kda.foundation.icon.system.mono_content_paste_go
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_content_paste_go)
JavaScript: tokens.kda.foundation.icon.system.mono_content_paste_go
kda.foundation.icon.system.mono_content_paste_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_content_paste_off)
JavaScript: tokens.kda.foundation.icon.system.mono_content_paste_off
kda.foundation.icon.system.mono_content_paste_search
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_content_paste_search)
JavaScript: tokens.kda.foundation.icon.system.mono_content_paste_search
kda.foundation.icon.system.mono_contrast
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_contrast)
JavaScript: tokens.kda.foundation.icon.system.mono_contrast
kda.foundation.icon.system.mono_control_point
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_control_point)
JavaScript: tokens.kda.foundation.icon.system.mono_control_point
kda.foundation.icon.system.mono_control_point_duplicate
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_control_point_duplicate)
JavaScript: tokens.kda.foundation.icon.system.mono_control_point_duplicate
kda.foundation.icon.system.mono_cookie
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_cookie)
JavaScript: tokens.kda.foundation.icon.system.mono_cookie
kda.foundation.icon.system.mono_copy_all
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_copy_all)
JavaScript: tokens.kda.foundation.icon.system.mono_copy_all
kda.foundation.icon.system.mono_copyright
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_copyright)
JavaScript: tokens.kda.foundation.icon.system.mono_copyright
kda.foundation.icon.system.mono_coronavirus
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_coronavirus)
JavaScript: tokens.kda.foundation.icon.system.mono_coronavirus
kda.foundation.icon.system.mono_corporate_fare
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_corporate_fare)
JavaScript: tokens.kda.foundation.icon.system.mono_corporate_fare
kda.foundation.icon.system.mono_create
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_create)
JavaScript: tokens.kda.foundation.icon.system.mono_create
kda.foundation.icon.system.mono_create_new_folder
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_create_new_folder)
JavaScript: tokens.kda.foundation.icon.system.mono_create_new_folder
kda.foundation.icon.system.mono_credit_card
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_credit_card)
JavaScript: tokens.kda.foundation.icon.system.mono_credit_card
kda.foundation.icon.system.mono_credit_card_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_credit_card_off)
JavaScript: tokens.kda.foundation.icon.system.mono_credit_card_off
kda.foundation.icon.system.mono_credit_score
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_credit_score)
JavaScript: tokens.kda.foundation.icon.system.mono_credit_score
kda.foundation.icon.system.mono_crisis_alert
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crisis_alert)
JavaScript: tokens.kda.foundation.icon.system.mono_crisis_alert
kda.foundation.icon.system.mono_crop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop)
JavaScript: tokens.kda.foundation.icon.system.mono_crop
kda.foundation.icon.system.mono_crop_16_9
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_16_9)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_16_9
kda.foundation.icon.system.mono_crop_3_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_3_2)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_3_2
kda.foundation.icon.system.mono_crop_5_4
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_5_4)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_5_4
kda.foundation.icon.system.mono_crop_7_5
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_7_5)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_7_5
kda.foundation.icon.system.mono_crop_din
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_din)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_din
kda.foundation.icon.system.mono_crop_free
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_free)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_free
kda.foundation.icon.system.mono_crop_landscape
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_landscape)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_landscape
kda.foundation.icon.system.mono_crop_original
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_original)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_original
kda.foundation.icon.system.mono_crop_portrait
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_portrait)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_portrait
kda.foundation.icon.system.mono_crop_rotate
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_rotate)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_rotate
kda.foundation.icon.system.mono_crop_square
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_crop_square)
JavaScript: tokens.kda.foundation.icon.system.mono_crop_square
kda.foundation.icon.system.mono_css
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_css)
JavaScript: tokens.kda.foundation.icon.system.mono_css
kda.foundation.icon.system.mono_currency_bitcoin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_bitcoin)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_bitcoin
kda.foundation.icon.system.mono_currency_exchange
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_exchange)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_exchange
kda.foundation.icon.system.mono_currency_franc
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_franc)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_franc
kda.foundation.icon.system.mono_currency_lira
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_lira)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_lira
kda.foundation.icon.system.mono_currency_pound
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_pound)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_pound
kda.foundation.icon.system.mono_currency_ruble
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_ruble)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_ruble
kda.foundation.icon.system.mono_currency_rupee
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_rupee)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_rupee
kda.foundation.icon.system.mono_currency_yen
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_yen)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_yen
kda.foundation.icon.system.mono_currency_yuan
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_currency_yuan)
JavaScript: tokens.kda.foundation.icon.system.mono_currency_yuan
kda.foundation.icon.system.mono_dangerous
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dangerous)
JavaScript: tokens.kda.foundation.icon.system.mono_dangerous
kda.foundation.icon.system.mono_dark_mode
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dark_mode)
JavaScript: tokens.kda.foundation.icon.system.mono_dark_mode
kda.foundation.icon.system.mono_dashboard
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dashboard)
JavaScript: tokens.kda.foundation.icon.system.mono_dashboard
kda.foundation.icon.system.mono_dashboard_customize
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dashboard_customize)
JavaScript: tokens.kda.foundation.icon.system.mono_dashboard_customize
kda.foundation.icon.system.mono_data_array
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_data_array)
JavaScript: tokens.kda.foundation.icon.system.mono_data_array
kda.foundation.icon.system.mono_data_exploration
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_data_exploration)
JavaScript: tokens.kda.foundation.icon.system.mono_data_exploration
kda.foundation.icon.system.mono_data_object
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_data_object)
JavaScript: tokens.kda.foundation.icon.system.mono_data_object
kda.foundation.icon.system.mono_data_saver_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_data_saver_off)
JavaScript: tokens.kda.foundation.icon.system.mono_data_saver_off
kda.foundation.icon.system.mono_data_saver_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_data_saver_on)
JavaScript: tokens.kda.foundation.icon.system.mono_data_saver_on
kda.foundation.icon.system.mono_data_thresholding
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_data_thresholding)
JavaScript: tokens.kda.foundation.icon.system.mono_data_thresholding
kda.foundation.icon.system.mono_data_usage
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_data_usage)
JavaScript: tokens.kda.foundation.icon.system.mono_data_usage
kda.foundation.icon.system.mono_dataset
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dataset)
JavaScript: tokens.kda.foundation.icon.system.mono_dataset
kda.foundation.icon.system.mono_dataset_linked
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dataset_linked)
JavaScript: tokens.kda.foundation.icon.system.mono_dataset_linked
kda.foundation.icon.system.mono_date_range
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_date_range)
JavaScript: tokens.kda.foundation.icon.system.mono_date_range
kda.foundation.icon.system.mono_dehaze
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dehaze)
JavaScript: tokens.kda.foundation.icon.system.mono_dehaze
kda.foundation.icon.system.mono_delete
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_delete)
JavaScript: tokens.kda.foundation.icon.system.mono_delete
kda.foundation.icon.system.mono_delete_forever
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_delete_forever)
JavaScript: tokens.kda.foundation.icon.system.mono_delete_forever
kda.foundation.icon.system.mono_delete_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_delete_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_delete_outline
kda.foundation.icon.system.mono_delete_sweep
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_delete_sweep)
JavaScript: tokens.kda.foundation.icon.system.mono_delete_sweep
kda.foundation.icon.system.mono_delivery_dining
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_delivery_dining)
JavaScript: tokens.kda.foundation.icon.system.mono_delivery_dining
kda.foundation.icon.system.mono_density_large
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_density_large)
JavaScript: tokens.kda.foundation.icon.system.mono_density_large
kda.foundation.icon.system.mono_density_medium
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_density_medium)
JavaScript: tokens.kda.foundation.icon.system.mono_density_medium
kda.foundation.icon.system.mono_density_small
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_density_small)
JavaScript: tokens.kda.foundation.icon.system.mono_density_small
kda.foundation.icon.system.mono_departure_board
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_departure_board)
JavaScript: tokens.kda.foundation.icon.system.mono_departure_board
kda.foundation.icon.system.mono_description
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_description)
JavaScript: tokens.kda.foundation.icon.system.mono_description
kda.foundation.icon.system.mono_details
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_details)
JavaScript: tokens.kda.foundation.icon.system.mono_details
kda.foundation.icon.system.mono_device_thermostat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_device_thermostat)
JavaScript: tokens.kda.foundation.icon.system.mono_device_thermostat
kda.foundation.icon.system.mono_devices
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_devices)
JavaScript: tokens.kda.foundation.icon.system.mono_devices
kda.foundation.icon.system.mono_devices_other
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_devices_other)
JavaScript: tokens.kda.foundation.icon.system.mono_devices_other
kda.foundation.icon.system.mono_dialpad
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dialpad)
JavaScript: tokens.kda.foundation.icon.system.mono_dialpad
kda.foundation.icon.system.mono_diamond
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_diamond)
JavaScript: tokens.kda.foundation.icon.system.mono_diamond
kda.foundation.icon.system.mono_difference
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_difference)
JavaScript: tokens.kda.foundation.icon.system.mono_difference
kda.foundation.icon.system.mono_dining
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dining)
JavaScript: tokens.kda.foundation.icon.system.mono_dining
kda.foundation.icon.system.mono_directions
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions)
JavaScript: tokens.kda.foundation.icon.system.mono_directions
kda.foundation.icon.system.mono_directions_bus
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_bus)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_bus
kda.foundation.icon.system.mono_directions_car
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_car)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_car
kda.foundation.icon.system.mono_directions_car_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_car_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_car_filled
kda.foundation.icon.system.mono_directions_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_off)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_off
kda.foundation.icon.system.mono_directions_railway
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_railway)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_railway
kda.foundation.icon.system.mono_directions_railway_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_railway_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_railway_filled
kda.foundation.icon.system.mono_directions_run
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_run)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_run
kda.foundation.icon.system.mono_directions_subway
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_subway)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_subway
kda.foundation.icon.system.mono_directions_subway_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_subway_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_subway_filled
kda.foundation.icon.system.mono_directions_transit
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_transit)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_transit
kda.foundation.icon.system.mono_directions_transit_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_transit_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_transit_filled
kda.foundation.icon.system.mono_directions_walk
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_directions_walk)
JavaScript: tokens.kda.foundation.icon.system.mono_directions_walk
kda.foundation.icon.system.mono_disabled_by_default
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_disabled_by_default)
JavaScript: tokens.kda.foundation.icon.system.mono_disabled_by_default
kda.foundation.icon.system.mono_disabled_visible
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_disabled_visible)
JavaScript: tokens.kda.foundation.icon.system.mono_disabled_visible
kda.foundation.icon.system.mono_disc_full
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_disc_full)
JavaScript: tokens.kda.foundation.icon.system.mono_disc_full
kda.foundation.icon.system.mono_discount
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_discount)
JavaScript: tokens.kda.foundation.icon.system.mono_discount
kda.foundation.icon.system.mono_dns
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_dns)
JavaScript: tokens.kda.foundation.icon.system.mono_dns
kda.foundation.icon.system.mono_do_disturb
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_disturb)
JavaScript: tokens.kda.foundation.icon.system.mono_do_disturb
kda.foundation.icon.system.mono_do_disturb_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_disturb_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_do_disturb_alt
kda.foundation.icon.system.mono_do_disturb_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_disturb_off)
JavaScript: tokens.kda.foundation.icon.system.mono_do_disturb_off
kda.foundation.icon.system.mono_do_disturb_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_disturb_on)
JavaScript: tokens.kda.foundation.icon.system.mono_do_disturb_on
kda.foundation.icon.system.mono_do_not_disturb
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_not_disturb)
JavaScript: tokens.kda.foundation.icon.system.mono_do_not_disturb
kda.foundation.icon.system.mono_do_not_disturb_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_not_disturb_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_do_not_disturb_alt
kda.foundation.icon.system.mono_do_not_disturb_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_not_disturb_off)
JavaScript: tokens.kda.foundation.icon.system.mono_do_not_disturb_off
kda.foundation.icon.system.mono_do_not_disturb_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_not_disturb_on)
JavaScript: tokens.kda.foundation.icon.system.mono_do_not_disturb_on
kda.foundation.icon.system.mono_do_not_disturb_on_total_silence
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_not_disturb_on_total_silence)
JavaScript: tokens.kda.foundation.icon.system.mono_do_not_disturb_on_total_silence
kda.foundation.icon.system.mono_do_not_step
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_not_step)
JavaScript: tokens.kda.foundation.icon.system.mono_do_not_step
kda.foundation.icon.system.mono_do_not_touch
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_do_not_touch)
JavaScript: tokens.kda.foundation.icon.system.mono_do_not_touch
kda.foundation.icon.system.mono_domain
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_domain)
JavaScript: tokens.kda.foundation.icon.system.mono_domain
kda.foundation.icon.system.mono_domain_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_domain_add)
JavaScript: tokens.kda.foundation.icon.system.mono_domain_add
kda.foundation.icon.system.mono_domain_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_domain_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_domain_disabled
kda.foundation.icon.system.mono_domain_verification
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_domain_verification)
JavaScript: tokens.kda.foundation.icon.system.mono_domain_verification
kda.foundation.icon.system.mono_done
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_done)
JavaScript: tokens.kda.foundation.icon.system.mono_done
kda.foundation.icon.system.mono_done_all
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_done_all)
JavaScript: tokens.kda.foundation.icon.system.mono_done_all
kda.foundation.icon.system.mono_donut_large
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_donut_large)
JavaScript: tokens.kda.foundation.icon.system.mono_donut_large
kda.foundation.icon.system.mono_donut_small
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_donut_small)
JavaScript: tokens.kda.foundation.icon.system.mono_donut_small
kda.foundation.icon.system.mono_door_sliding
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_door_sliding)
JavaScript: tokens.kda.foundation.icon.system.mono_door_sliding
kda.foundation.icon.system.mono_download
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_download)
JavaScript: tokens.kda.foundation.icon.system.mono_download
kda.foundation.icon.system.mono_download_done
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_download_done)
JavaScript: tokens.kda.foundation.icon.system.mono_download_done
kda.foundation.icon.system.mono_download_for_offline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_download_for_offline)
JavaScript: tokens.kda.foundation.icon.system.mono_download_for_offline
kda.foundation.icon.system.mono_downloading
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_downloading)
JavaScript: tokens.kda.foundation.icon.system.mono_downloading
kda.foundation.icon.system.mono_drafts
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_drafts)
JavaScript: tokens.kda.foundation.icon.system.mono_drafts
kda.foundation.icon.system.mono_drive_eta
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_drive_eta)
JavaScript: tokens.kda.foundation.icon.system.mono_drive_eta
kda.foundation.icon.system.mono_drive_file_move
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_drive_file_move)
JavaScript: tokens.kda.foundation.icon.system.mono_drive_file_move
kda.foundation.icon.system.mono_drive_file_move_rtl
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_drive_file_move_rtl)
JavaScript: tokens.kda.foundation.icon.system.mono_drive_file_move_rtl
kda.foundation.icon.system.mono_drive_file_rename_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_drive_file_rename_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_drive_file_rename_outline
kda.foundation.icon.system.mono_drive_folder_upload
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_drive_folder_upload)
JavaScript: tokens.kda.foundation.icon.system.mono_drive_folder_upload
kda.foundation.icon.system.mono_earbuds
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_earbuds)
JavaScript: tokens.kda.foundation.icon.system.mono_earbuds
kda.foundation.icon.system.mono_edit_attributes
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_edit_attributes)
JavaScript: tokens.kda.foundation.icon.system.mono_edit_attributes
kda.foundation.icon.system.mono_edit_calendar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_edit_calendar)
JavaScript: tokens.kda.foundation.icon.system.mono_edit_calendar
kda.foundation.icon.system.mono_edit_note
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_edit_note)
JavaScript: tokens.kda.foundation.icon.system.mono_edit_note
kda.foundation.icon.system.mono_edit_road
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_edit_road)
JavaScript: tokens.kda.foundation.icon.system.mono_edit_road
kda.foundation.icon.system.mono_electric_bolt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_electric_bolt)
JavaScript: tokens.kda.foundation.icon.system.mono_electric_bolt
kda.foundation.icon.system.mono_electrical_services
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_electrical_services)
JavaScript: tokens.kda.foundation.icon.system.mono_electrical_services
kda.foundation.icon.system.mono_emergency
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_emergency)
JavaScript: tokens.kda.foundation.icon.system.mono_emergency
kda.foundation.icon.system.mono_enhanced_encryption
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_enhanced_encryption)
JavaScript: tokens.kda.foundation.icon.system.mono_enhanced_encryption
kda.foundation.icon.system.mono_equalizer
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_equalizer)
JavaScript: tokens.kda.foundation.icon.system.mono_equalizer
kda.foundation.icon.system.mono_error
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_error)
JavaScript: tokens.kda.foundation.icon.system.mono_error
kda.foundation.icon.system.mono_error_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_error_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_error_outline
kda.foundation.icon.system.mono_escalator_warning
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_escalator_warning)
JavaScript: tokens.kda.foundation.icon.system.mono_escalator_warning
kda.foundation.icon.system.mono_euro_symbol
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_euro_symbol)
JavaScript: tokens.kda.foundation.icon.system.mono_euro_symbol
kda.foundation.icon.system.mono_ev_station
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_ev_station)
JavaScript: tokens.kda.foundation.icon.system.mono_ev_station
kda.foundation.icon.system.mono_event
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_event)
JavaScript: tokens.kda.foundation.icon.system.mono_event
kda.foundation.icon.system.mono_event_available
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_event_available)
JavaScript: tokens.kda.foundation.icon.system.mono_event_available
kda.foundation.icon.system.mono_event_busy
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_event_busy)
JavaScript: tokens.kda.foundation.icon.system.mono_event_busy
kda.foundation.icon.system.mono_event_note
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_event_note)
JavaScript: tokens.kda.foundation.icon.system.mono_event_note
kda.foundation.icon.system.mono_event_repeat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_event_repeat)
JavaScript: tokens.kda.foundation.icon.system.mono_event_repeat
kda.foundation.icon.system.mono_event_seat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_event_seat)
JavaScript: tokens.kda.foundation.icon.system.mono_event_seat
kda.foundation.icon.system.mono_exit_to_app
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_exit_to_app)
JavaScript: tokens.kda.foundation.icon.system.mono_exit_to_app
kda.foundation.icon.system.mono_expand
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_expand)
JavaScript: tokens.kda.foundation.icon.system.mono_expand
kda.foundation.icon.system.mono_expand_circle_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_expand_circle_down)
JavaScript: tokens.kda.foundation.icon.system.mono_expand_circle_down
kda.foundation.icon.system.mono_expand_less
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_expand_less)
JavaScript: tokens.kda.foundation.icon.system.mono_expand_less
kda.foundation.icon.system.mono_expand_more
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_expand_more)
JavaScript: tokens.kda.foundation.icon.system.mono_expand_more
kda.foundation.icon.system.mono_explicit
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_explicit)
JavaScript: tokens.kda.foundation.icon.system.mono_explicit
kda.foundation.icon.system.mono_explore
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_explore)
JavaScript: tokens.kda.foundation.icon.system.mono_explore
kda.foundation.icon.system.mono_explore_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_explore_off)
JavaScript: tokens.kda.foundation.icon.system.mono_explore_off
kda.foundation.icon.system.mono_exposure
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_exposure)
JavaScript: tokens.kda.foundation.icon.system.mono_exposure
kda.foundation.icon.system.mono_extension
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_extension)
JavaScript: tokens.kda.foundation.icon.system.mono_extension
kda.foundation.icon.system.mono_extension_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_extension_off)
JavaScript: tokens.kda.foundation.icon.system.mono_extension_off
kda.foundation.icon.system.mono_face
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face)
JavaScript: tokens.kda.foundation.icon.system.mono_face
kda.foundation.icon.system.mono_face_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face_2)
JavaScript: tokens.kda.foundation.icon.system.mono_face_2
kda.foundation.icon.system.mono_face_3
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face_3)
JavaScript: tokens.kda.foundation.icon.system.mono_face_3
kda.foundation.icon.system.mono_face_4
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face_4)
JavaScript: tokens.kda.foundation.icon.system.mono_face_4
kda.foundation.icon.system.mono_face_5
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face_5)
JavaScript: tokens.kda.foundation.icon.system.mono_face_5
kda.foundation.icon.system.mono_face_6
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face_6)
JavaScript: tokens.kda.foundation.icon.system.mono_face_6
kda.foundation.icon.system.mono_face_retouching_natural
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face_retouching_natural)
JavaScript: tokens.kda.foundation.icon.system.mono_face_retouching_natural
kda.foundation.icon.system.mono_face_retouching_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_face_retouching_off)
JavaScript: tokens.kda.foundation.icon.system.mono_face_retouching_off
kda.foundation.icon.system.mono_fact_check
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fact_check)
JavaScript: tokens.kda.foundation.icon.system.mono_fact_check
kda.foundation.icon.system.mono_family_restroom
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_family_restroom)
JavaScript: tokens.kda.foundation.icon.system.mono_family_restroom
kda.foundation.icon.system.mono_favorite
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_favorite)
JavaScript: tokens.kda.foundation.icon.system.mono_favorite
kda.foundation.icon.system.mono_favorite_border
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_favorite_border)
JavaScript: tokens.kda.foundation.icon.system.mono_favorite_border
kda.foundation.icon.system.mono_feed
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_feed)
JavaScript: tokens.kda.foundation.icon.system.mono_feed
kda.foundation.icon.system.mono_feedback
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_feedback)
JavaScript: tokens.kda.foundation.icon.system.mono_feedback
kda.foundation.icon.system.mono_fiber_new
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fiber_new)
JavaScript: tokens.kda.foundation.icon.system.mono_fiber_new
kda.foundation.icon.system.mono_fiber_pin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fiber_pin)
JavaScript: tokens.kda.foundation.icon.system.mono_fiber_pin
kda.foundation.icon.system.mono_fiber_smart_record
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fiber_smart_record)
JavaScript: tokens.kda.foundation.icon.system.mono_fiber_smart_record
kda.foundation.icon.system.mono_file_copy
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_file_copy)
JavaScript: tokens.kda.foundation.icon.system.mono_file_copy
kda.foundation.icon.system.mono_file_download
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_file_download)
JavaScript: tokens.kda.foundation.icon.system.mono_file_download
kda.foundation.icon.system.mono_file_download_done
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_file_download_done)
JavaScript: tokens.kda.foundation.icon.system.mono_file_download_done
kda.foundation.icon.system.mono_file_download_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_file_download_off)
JavaScript: tokens.kda.foundation.icon.system.mono_file_download_off
kda.foundation.icon.system.mono_file_open
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_file_open)
JavaScript: tokens.kda.foundation.icon.system.mono_file_open
kda.foundation.icon.system.mono_file_present
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_file_present)
JavaScript: tokens.kda.foundation.icon.system.mono_file_present
kda.foundation.icon.system.mono_file_upload
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_file_upload)
JavaScript: tokens.kda.foundation.icon.system.mono_file_upload
kda.foundation.icon.system.mono_filter
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter)
JavaScript: tokens.kda.foundation.icon.system.mono_filter
kda.foundation.icon.system.mono_filter_1
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_1)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_1
kda.foundation.icon.system.mono_filter_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_2)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_2
kda.foundation.icon.system.mono_filter_3
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_3)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_3
kda.foundation.icon.system.mono_filter_4
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_4)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_4
kda.foundation.icon.system.mono_filter_5
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_5)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_5
kda.foundation.icon.system.mono_filter_6
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_6)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_6
kda.foundation.icon.system.mono_filter_7
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_7)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_7
kda.foundation.icon.system.mono_filter_8
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_8)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_8
kda.foundation.icon.system.mono_filter_9
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_9)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_9
kda.foundation.icon.system.mono_filter_9_plus
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_9_plus)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_9_plus
kda.foundation.icon.system.mono_filter_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_alt
kda.foundation.icon.system.mono_filter_alt_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_alt_off)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_alt_off
kda.foundation.icon.system.mono_filter_b_and_w
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_b_and_w)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_b_and_w
kda.foundation.icon.system.mono_filter_center_focus
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_center_focus)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_center_focus
kda.foundation.icon.system.mono_filter_drama
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_drama)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_drama
kda.foundation.icon.system.mono_filter_frames
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_frames)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_frames
kda.foundation.icon.system.mono_filter_hdr
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_hdr)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_hdr
kda.foundation.icon.system.mono_filter_list
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_list)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_list
kda.foundation.icon.system.mono_filter_list_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_list_off)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_list_off
kda.foundation.icon.system.mono_filter_none
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_none)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_none
kda.foundation.icon.system.mono_filter_tilt_shift
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_filter_tilt_shift)
JavaScript: tokens.kda.foundation.icon.system.mono_filter_tilt_shift
kda.foundation.icon.system.mono_find_in_page
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_find_in_page)
JavaScript: tokens.kda.foundation.icon.system.mono_find_in_page
kda.foundation.icon.system.mono_find_replace
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_find_replace)
JavaScript: tokens.kda.foundation.icon.system.mono_find_replace
kda.foundation.icon.system.mono_fingerprint
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fingerprint)
JavaScript: tokens.kda.foundation.icon.system.mono_fingerprint
kda.foundation.icon.system.mono_flag
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flag)
JavaScript: tokens.kda.foundation.icon.system.mono_flag
kda.foundation.icon.system.mono_flag_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flag_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_flag_circle
kda.foundation.icon.system.mono_flaky
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flaky)
JavaScript: tokens.kda.foundation.icon.system.mono_flaky
kda.foundation.icon.system.mono_flash_auto
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flash_auto)
JavaScript: tokens.kda.foundation.icon.system.mono_flash_auto
kda.foundation.icon.system.mono_flash_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flash_off)
JavaScript: tokens.kda.foundation.icon.system.mono_flash_off
kda.foundation.icon.system.mono_flash_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flash_on)
JavaScript: tokens.kda.foundation.icon.system.mono_flash_on
kda.foundation.icon.system.mono_flight
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flight)
JavaScript: tokens.kda.foundation.icon.system.mono_flight
kda.foundation.icon.system.mono_flight_land
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flight_land)
JavaScript: tokens.kda.foundation.icon.system.mono_flight_land
kda.foundation.icon.system.mono_flight_takeoff
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flight_takeoff)
JavaScript: tokens.kda.foundation.icon.system.mono_flight_takeoff
kda.foundation.icon.system.mono_flip
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flip)
JavaScript: tokens.kda.foundation.icon.system.mono_flip
kda.foundation.icon.system.mono_flip_camera_android
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flip_camera_android)
JavaScript: tokens.kda.foundation.icon.system.mono_flip_camera_android
kda.foundation.icon.system.mono_flip_to_back
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flip_to_back)
JavaScript: tokens.kda.foundation.icon.system.mono_flip_to_back
kda.foundation.icon.system.mono_flip_to_front
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_flip_to_front)
JavaScript: tokens.kda.foundation.icon.system.mono_flip_to_front
kda.foundation.icon.system.mono_folder
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_folder)
JavaScript: tokens.kda.foundation.icon.system.mono_folder
kda.foundation.icon.system.mono_folder_open
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_folder_open)
JavaScript: tokens.kda.foundation.icon.system.mono_folder_open
kda.foundation.icon.system.mono_folder_shared
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_folder_shared)
JavaScript: tokens.kda.foundation.icon.system.mono_folder_shared
kda.foundation.icon.system.mono_folder_special
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_folder_special)
JavaScript: tokens.kda.foundation.icon.system.mono_folder_special
kda.foundation.icon.system.mono_folder_zip
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_folder_zip)
JavaScript: tokens.kda.foundation.icon.system.mono_folder_zip
kda.foundation.icon.system.mono_fork_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fork_left)
JavaScript: tokens.kda.foundation.icon.system.mono_fork_left
kda.foundation.icon.system.mono_fork_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fork_right)
JavaScript: tokens.kda.foundation.icon.system.mono_fork_right
kda.foundation.icon.system.mono_format_align_center
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_align_center)
JavaScript: tokens.kda.foundation.icon.system.mono_format_align_center
kda.foundation.icon.system.mono_format_align_justify
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_align_justify)
JavaScript: tokens.kda.foundation.icon.system.mono_format_align_justify
kda.foundation.icon.system.mono_format_align_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_align_left)
JavaScript: tokens.kda.foundation.icon.system.mono_format_align_left
kda.foundation.icon.system.mono_format_align_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_align_right)
JavaScript: tokens.kda.foundation.icon.system.mono_format_align_right
kda.foundation.icon.system.mono_format_bold
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_bold)
JavaScript: tokens.kda.foundation.icon.system.mono_format_bold
kda.foundation.icon.system.mono_format_clear
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_clear)
JavaScript: tokens.kda.foundation.icon.system.mono_format_clear
kda.foundation.icon.system.mono_format_color_fill
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_color_fill)
JavaScript: tokens.kda.foundation.icon.system.mono_format_color_fill
kda.foundation.icon.system.mono_format_color_reset
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_color_reset)
JavaScript: tokens.kda.foundation.icon.system.mono_format_color_reset
kda.foundation.icon.system.mono_format_color_text
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_color_text)
JavaScript: tokens.kda.foundation.icon.system.mono_format_color_text
kda.foundation.icon.system.mono_format_indent_decrease
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_indent_decrease)
JavaScript: tokens.kda.foundation.icon.system.mono_format_indent_decrease
kda.foundation.icon.system.mono_format_indent_increase
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_indent_increase)
JavaScript: tokens.kda.foundation.icon.system.mono_format_indent_increase
kda.foundation.icon.system.mono_format_italic
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_italic)
JavaScript: tokens.kda.foundation.icon.system.mono_format_italic
kda.foundation.icon.system.mono_format_line_spacing
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_line_spacing)
JavaScript: tokens.kda.foundation.icon.system.mono_format_line_spacing
kda.foundation.icon.system.mono_format_list_bulleted
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_list_bulleted)
JavaScript: tokens.kda.foundation.icon.system.mono_format_list_bulleted
kda.foundation.icon.system.mono_format_list_numbered
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_list_numbered)
JavaScript: tokens.kda.foundation.icon.system.mono_format_list_numbered
kda.foundation.icon.system.mono_format_list_numbered_rtl
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_list_numbered_rtl)
JavaScript: tokens.kda.foundation.icon.system.mono_format_list_numbered_rtl
kda.foundation.icon.system.mono_format_overline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_overline)
JavaScript: tokens.kda.foundation.icon.system.mono_format_overline
kda.foundation.icon.system.mono_format_paint
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_paint)
JavaScript: tokens.kda.foundation.icon.system.mono_format_paint
kda.foundation.icon.system.mono_format_quote
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_quote)
JavaScript: tokens.kda.foundation.icon.system.mono_format_quote
kda.foundation.icon.system.mono_format_shapes
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_shapes)
JavaScript: tokens.kda.foundation.icon.system.mono_format_shapes
kda.foundation.icon.system.mono_format_size
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_size)
JavaScript: tokens.kda.foundation.icon.system.mono_format_size
kda.foundation.icon.system.mono_format_strikethrough
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_strikethrough)
JavaScript: tokens.kda.foundation.icon.system.mono_format_strikethrough
kda.foundation.icon.system.mono_format_textdirection_l_to_r
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_textdirection_l_to_r)
JavaScript: tokens.kda.foundation.icon.system.mono_format_textdirection_l_to_r
kda.foundation.icon.system.mono_format_textdirection_r_to_l
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_textdirection_r_to_l)
JavaScript: tokens.kda.foundation.icon.system.mono_format_textdirection_r_to_l
kda.foundation.icon.system.mono_format_underlined
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_format_underlined)
JavaScript: tokens.kda.foundation.icon.system.mono_format_underlined
kda.foundation.icon.system.mono_forum
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_forum)
JavaScript: tokens.kda.foundation.icon.system.mono_forum
kda.foundation.icon.system.mono_forward
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_forward)
JavaScript: tokens.kda.foundation.icon.system.mono_forward
kda.foundation.icon.system.mono_free_cancellation
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_free_cancellation)
JavaScript: tokens.kda.foundation.icon.system.mono_free_cancellation
kda.foundation.icon.system.mono_fullscreen
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fullscreen)
JavaScript: tokens.kda.foundation.icon.system.mono_fullscreen
kda.foundation.icon.system.mono_fullscreen_exit
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_fullscreen_exit)
JavaScript: tokens.kda.foundation.icon.system.mono_fullscreen_exit
kda.foundation.icon.system.mono_gesture
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_gesture)
JavaScript: tokens.kda.foundation.icon.system.mono_gesture
kda.foundation.icon.system.mono_get_app
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_get_app)
JavaScript: tokens.kda.foundation.icon.system.mono_get_app
kda.foundation.icon.system.mono_gpp_bad
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_gpp_bad)
JavaScript: tokens.kda.foundation.icon.system.mono_gpp_bad
kda.foundation.icon.system.mono_gpp_good
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_gpp_good)
JavaScript: tokens.kda.foundation.icon.system.mono_gpp_good
kda.foundation.icon.system.mono_gpp_maybe
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_gpp_maybe)
JavaScript: tokens.kda.foundation.icon.system.mono_gpp_maybe
kda.foundation.icon.system.mono_grade
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_grade)
JavaScript: tokens.kda.foundation.icon.system.mono_grade
kda.foundation.icon.system.mono_gradient
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_gradient)
JavaScript: tokens.kda.foundation.icon.system.mono_gradient
kda.foundation.icon.system.mono_grading
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_grading)
JavaScript: tokens.kda.foundation.icon.system.mono_grading
kda.foundation.icon.system.mono_graphic_eq
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_graphic_eq)
JavaScript: tokens.kda.foundation.icon.system.mono_graphic_eq
kda.foundation.icon.system.mono_grid_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_grid_off)
JavaScript: tokens.kda.foundation.icon.system.mono_grid_off
kda.foundation.icon.system.mono_grid_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_grid_on)
JavaScript: tokens.kda.foundation.icon.system.mono_grid_on
kda.foundation.icon.system.mono_grid_view
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_grid_view)
JavaScript: tokens.kda.foundation.icon.system.mono_grid_view
kda.foundation.icon.system.mono_group
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_group)
JavaScript: tokens.kda.foundation.icon.system.mono_group
kda.foundation.icon.system.mono_group_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_group_add)
JavaScript: tokens.kda.foundation.icon.system.mono_group_add
kda.foundation.icon.system.mono_group_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_group_off)
JavaScript: tokens.kda.foundation.icon.system.mono_group_off
kda.foundation.icon.system.mono_group_remove
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_group_remove)
JavaScript: tokens.kda.foundation.icon.system.mono_group_remove
kda.foundation.icon.system.mono_group_work
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_group_work)
JavaScript: tokens.kda.foundation.icon.system.mono_group_work
kda.foundation.icon.system.mono_groups
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_groups)
JavaScript: tokens.kda.foundation.icon.system.mono_groups
kda.foundation.icon.system.mono_groups_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_groups_2)
JavaScript: tokens.kda.foundation.icon.system.mono_groups_2
kda.foundation.icon.system.mono_groups_3
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_groups_3)
JavaScript: tokens.kda.foundation.icon.system.mono_groups_3
kda.foundation.icon.system.mono_handyman
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_handyman)
JavaScript: tokens.kda.foundation.icon.system.mono_handyman
kda.foundation.icon.system.mono_hardware
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hardware)
JavaScript: tokens.kda.foundation.icon.system.mono_hardware
kda.foundation.icon.system.mono_hd
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hd)
JavaScript: tokens.kda.foundation.icon.system.mono_hd
kda.foundation.icon.system.mono_hdr_strong
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hdr_strong)
JavaScript: tokens.kda.foundation.icon.system.mono_hdr_strong
kda.foundation.icon.system.mono_hdr_weak
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hdr_weak)
JavaScript: tokens.kda.foundation.icon.system.mono_hdr_weak
kda.foundation.icon.system.mono_headphones
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_headphones)
JavaScript: tokens.kda.foundation.icon.system.mono_headphones
kda.foundation.icon.system.mono_headphones_battery
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_headphones_battery)
JavaScript: tokens.kda.foundation.icon.system.mono_headphones_battery
kda.foundation.icon.system.mono_headset
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_headset)
JavaScript: tokens.kda.foundation.icon.system.mono_headset
kda.foundation.icon.system.mono_headset_mic
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_headset_mic)
JavaScript: tokens.kda.foundation.icon.system.mono_headset_mic
kda.foundation.icon.system.mono_headset_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_headset_off)
JavaScript: tokens.kda.foundation.icon.system.mono_headset_off
kda.foundation.icon.system.mono_health_and_safety
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_health_and_safety)
JavaScript: tokens.kda.foundation.icon.system.mono_health_and_safety
kda.foundation.icon.system.mono_help
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_help)
JavaScript: tokens.kda.foundation.icon.system.mono_help
kda.foundation.icon.system.mono_help_center
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_help_center)
JavaScript: tokens.kda.foundation.icon.system.mono_help_center
kda.foundation.icon.system.mono_help_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_help_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_help_outline
kda.foundation.icon.system.mono_highlight_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_highlight_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_highlight_alt
kda.foundation.icon.system.mono_highlight_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_highlight_off)
JavaScript: tokens.kda.foundation.icon.system.mono_highlight_off
kda.foundation.icon.system.mono_history
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_history)
JavaScript: tokens.kda.foundation.icon.system.mono_history
kda.foundation.icon.system.mono_history_toggle_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_history_toggle_off)
JavaScript: tokens.kda.foundation.icon.system.mono_history_toggle_off
kda.foundation.icon.system.mono_hourglass_bottom
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hourglass_bottom)
JavaScript: tokens.kda.foundation.icon.system.mono_hourglass_bottom
kda.foundation.icon.system.mono_hourglass_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hourglass_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_hourglass_disabled
kda.foundation.icon.system.mono_hourglass_empty
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hourglass_empty)
JavaScript: tokens.kda.foundation.icon.system.mono_hourglass_empty
kda.foundation.icon.system.mono_hourglass_full
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hourglass_full)
JavaScript: tokens.kda.foundation.icon.system.mono_hourglass_full
kda.foundation.icon.system.mono_hourglass_top
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hourglass_top)
JavaScript: tokens.kda.foundation.icon.system.mono_hourglass_top
kda.foundation.icon.system.mono_how_to_reg
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_how_to_reg)
JavaScript: tokens.kda.foundation.icon.system.mono_how_to_reg
kda.foundation.icon.system.mono_how_to_vote
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_how_to_vote)
JavaScript: tokens.kda.foundation.icon.system.mono_how_to_vote
kda.foundation.icon.system.mono_https
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_https)
JavaScript: tokens.kda.foundation.icon.system.mono_https
kda.foundation.icon.system.mono_hub
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_hub)
JavaScript: tokens.kda.foundation.icon.system.mono_hub
kda.foundation.icon.system.mono_incoming_funds
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_incoming_funds)
JavaScript: tokens.kda.foundation.icon.system.mono_incoming_funds
kda.foundation.icon.system.mono_incoming_multichain_funds
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_incoming_multichain_funds)
JavaScript: tokens.kda.foundation.icon.system.mono_incoming_multichain_funds
kda.foundation.icon.system.mono_info
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_info)
JavaScript: tokens.kda.foundation.icon.system.mono_info
kda.foundation.icon.system.mono_input
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_input)
JavaScript: tokens.kda.foundation.icon.system.mono_input
kda.foundation.icon.system.mono_insert_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_chart
kda.foundation.icon.system.mono_insert_chart_outlined
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_chart_outlined)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_chart_outlined
kda.foundation.icon.system.mono_insert_comment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_comment)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_comment
kda.foundation.icon.system.mono_insert_drive_file
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_drive_file)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_drive_file
kda.foundation.icon.system.mono_insert_emoticon
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_emoticon)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_emoticon
kda.foundation.icon.system.mono_insert_invitation
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_invitation)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_invitation
kda.foundation.icon.system.mono_insert_link
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_link)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_link
kda.foundation.icon.system.mono_insert_page_break
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_page_break)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_page_break
kda.foundation.icon.system.mono_insert_photo
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insert_photo)
JavaScript: tokens.kda.foundation.icon.system.mono_insert_photo
kda.foundation.icon.system.mono_insights
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_insights)
JavaScript: tokens.kda.foundation.icon.system.mono_insights
kda.foundation.icon.system.mono_install_desktop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_install_desktop)
JavaScript: tokens.kda.foundation.icon.system.mono_install_desktop
kda.foundation.icon.system.mono_install_mobile
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_install_mobile)
JavaScript: tokens.kda.foundation.icon.system.mono_install_mobile
kda.foundation.icon.system.mono_integration_instructions
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_integration_instructions)
JavaScript: tokens.kda.foundation.icon.system.mono_integration_instructions
kda.foundation.icon.system.mono_interests
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_interests)
JavaScript: tokens.kda.foundation.icon.system.mono_interests
kda.foundation.icon.system.mono_inventory
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_inventory)
JavaScript: tokens.kda.foundation.icon.system.mono_inventory
kda.foundation.icon.system.mono_ios_share
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_ios_share)
JavaScript: tokens.kda.foundation.icon.system.mono_ios_share
kda.foundation.icon.system.mono_iso
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_iso)
JavaScript: tokens.kda.foundation.icon.system.mono_iso
kda.foundation.icon.system.mono_join_full
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_join_full)
JavaScript: tokens.kda.foundation.icon.system.mono_join_full
kda.foundation.icon.system.mono_join_inner
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_join_inner)
JavaScript: tokens.kda.foundation.icon.system.mono_join_inner
kda.foundation.icon.system.mono_join_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_join_left)
JavaScript: tokens.kda.foundation.icon.system.mono_join_left
kda.foundation.icon.system.mono_join_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_join_right)
JavaScript: tokens.kda.foundation.icon.system.mono_join_right
kda.foundation.icon.system.mono_k_account
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_k_account)
JavaScript: tokens.kda.foundation.icon.system.mono_k_account
kda.foundation.icon.system.mono_key
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_key)
JavaScript: tokens.kda.foundation.icon.system.mono_key
kda.foundation.icon.system.mono_key_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_key_off)
JavaScript: tokens.kda.foundation.icon.system.mono_key_off
kda.foundation.icon.system.mono_keyboard
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard
kda.foundation.icon.system.mono_keyboard_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_alt
kda.foundation.icon.system.mono_keyboard_arrow_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_arrow_down)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_arrow_down
kda.foundation.icon.system.mono_keyboard_arrow_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_arrow_left)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_arrow_left
kda.foundation.icon.system.mono_keyboard_arrow_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_arrow_right)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_arrow_right
kda.foundation.icon.system.mono_keyboard_arrow_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_arrow_up)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_arrow_up
kda.foundation.icon.system.mono_keyboard_backspace
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_backspace)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_backspace
kda.foundation.icon.system.mono_keyboard_capslock
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_capslock)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_capslock
kda.foundation.icon.system.mono_keyboard_command_key
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_command_key)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_command_key
kda.foundation.icon.system.mono_keyboard_control_key
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_control_key)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_control_key
kda.foundation.icon.system.mono_keyboard_double_arrow_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_double_arrow_down)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_double_arrow_down
kda.foundation.icon.system.mono_keyboard_double_arrow_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_double_arrow_left)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_double_arrow_left
kda.foundation.icon.system.mono_keyboard_double_arrow_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_double_arrow_right)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_double_arrow_right
kda.foundation.icon.system.mono_keyboard_double_arrow_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_double_arrow_up)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_double_arrow_up
kda.foundation.icon.system.mono_keyboard_hide
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_hide)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_hide
kda.foundation.icon.system.mono_keyboard_option_key
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_option_key)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_option_key
kda.foundation.icon.system.mono_keyboard_return
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_return)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_return
kda.foundation.icon.system.mono_keyboard_tab
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_tab)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_tab
kda.foundation.icon.system.mono_keyboard_voice
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_keyboard_voice)
JavaScript: tokens.kda.foundation.icon.system.mono_keyboard_voice
kda.foundation.icon.system.mono_label
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_label)
JavaScript: tokens.kda.foundation.icon.system.mono_label
kda.foundation.icon.system.mono_label_important
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_label_important)
JavaScript: tokens.kda.foundation.icon.system.mono_label_important
kda.foundation.icon.system.mono_label_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_label_off)
JavaScript: tokens.kda.foundation.icon.system.mono_label_off
kda.foundation.icon.system.mono_lan
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lan)
JavaScript: tokens.kda.foundation.icon.system.mono_lan
kda.foundation.icon.system.mono_language
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_language)
JavaScript: tokens.kda.foundation.icon.system.mono_language
kda.foundation.icon.system.mono_laptop_mac
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_laptop_mac)
JavaScript: tokens.kda.foundation.icon.system.mono_laptop_mac
kda.foundation.icon.system.mono_last_page
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_last_page)
JavaScript: tokens.kda.foundation.icon.system.mono_last_page
kda.foundation.icon.system.mono_launch
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_launch)
JavaScript: tokens.kda.foundation.icon.system.mono_launch
kda.foundation.icon.system.mono_layers
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_layers)
JavaScript: tokens.kda.foundation.icon.system.mono_layers
kda.foundation.icon.system.mono_layers_clear
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_layers_clear)
JavaScript: tokens.kda.foundation.icon.system.mono_layers_clear
kda.foundation.icon.system.mono_ledger
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_ledger)
JavaScript: tokens.kda.foundation.icon.system.mono_ledger
kda.foundation.icon.system.mono_legend_toggle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_legend_toggle)
JavaScript: tokens.kda.foundation.icon.system.mono_legend_toggle
kda.foundation.icon.system.mono_library_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_library_add)
JavaScript: tokens.kda.foundation.icon.system.mono_library_add
kda.foundation.icon.system.mono_library_add_check
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_library_add_check)
JavaScript: tokens.kda.foundation.icon.system.mono_library_add_check
kda.foundation.icon.system.mono_library_books
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_library_books)
JavaScript: tokens.kda.foundation.icon.system.mono_library_books
kda.foundation.icon.system.mono_library_music
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_library_music)
JavaScript: tokens.kda.foundation.icon.system.mono_library_music
kda.foundation.icon.system.mono_light_mode
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_light_mode)
JavaScript: tokens.kda.foundation.icon.system.mono_light_mode
kda.foundation.icon.system.mono_lightbulb
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lightbulb)
JavaScript: tokens.kda.foundation.icon.system.mono_lightbulb
kda.foundation.icon.system.mono_lightbulb_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lightbulb_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_lightbulb_circle
kda.foundation.icon.system.mono_line_axis
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_line_axis)
JavaScript: tokens.kda.foundation.icon.system.mono_line_axis
kda.foundation.icon.system.mono_line_style
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_line_style)
JavaScript: tokens.kda.foundation.icon.system.mono_line_style
kda.foundation.icon.system.mono_line_weight
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_line_weight)
JavaScript: tokens.kda.foundation.icon.system.mono_line_weight
kda.foundation.icon.system.mono_linear_scale
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_linear_scale)
JavaScript: tokens.kda.foundation.icon.system.mono_linear_scale
kda.foundation.icon.system.mono_link
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_link)
JavaScript: tokens.kda.foundation.icon.system.mono_link
kda.foundation.icon.system.mono_link_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_link_off)
JavaScript: tokens.kda.foundation.icon.system.mono_link_off
kda.foundation.icon.system.mono_linked_camera
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_linked_camera)
JavaScript: tokens.kda.foundation.icon.system.mono_linked_camera
kda.foundation.icon.system.mono_list
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_list)
JavaScript: tokens.kda.foundation.icon.system.mono_list
kda.foundation.icon.system.mono_list_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_list_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_list_alt
kda.foundation.icon.system.mono_live_help
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_live_help)
JavaScript: tokens.kda.foundation.icon.system.mono_live_help
kda.foundation.icon.system.mono_live_tv
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_live_tv)
JavaScript: tokens.kda.foundation.icon.system.mono_live_tv
kda.foundation.icon.system.mono_loading
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_loading)
JavaScript: tokens.kda.foundation.icon.system.mono_loading
kda.foundation.icon.system.mono_local_gas_station
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_local_gas_station)
JavaScript: tokens.kda.foundation.icon.system.mono_local_gas_station
kda.foundation.icon.system.mono_local_grocery_store
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_local_grocery_store)
JavaScript: tokens.kda.foundation.icon.system.mono_local_grocery_store
kda.foundation.icon.system.mono_local_hospital
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_local_hospital)
JavaScript: tokens.kda.foundation.icon.system.mono_local_hospital
kda.foundation.icon.system.mono_local_offer
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_local_offer)
JavaScript: tokens.kda.foundation.icon.system.mono_local_offer
kda.foundation.icon.system.mono_local_post_office
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_local_post_office)
JavaScript: tokens.kda.foundation.icon.system.mono_local_post_office
kda.foundation.icon.system.mono_local_printshop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_local_printshop)
JavaScript: tokens.kda.foundation.icon.system.mono_local_printshop
kda.foundation.icon.system.mono_local_see
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_local_see)
JavaScript: tokens.kda.foundation.icon.system.mono_local_see
kda.foundation.icon.system.mono_location_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_location_off)
JavaScript: tokens.kda.foundation.icon.system.mono_location_off
kda.foundation.icon.system.mono_location_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_location_on)
JavaScript: tokens.kda.foundation.icon.system.mono_location_on
kda.foundation.icon.system.mono_location_searching
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_location_searching)
JavaScript: tokens.kda.foundation.icon.system.mono_location_searching
kda.foundation.icon.system.mono_lock
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lock)
JavaScript: tokens.kda.foundation.icon.system.mono_lock
kda.foundation.icon.system.mono_lock_clock
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lock_clock)
JavaScript: tokens.kda.foundation.icon.system.mono_lock_clock
kda.foundation.icon.system.mono_lock_open
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lock_open)
JavaScript: tokens.kda.foundation.icon.system.mono_lock_open
kda.foundation.icon.system.mono_lock_person
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lock_person)
JavaScript: tokens.kda.foundation.icon.system.mono_lock_person
kda.foundation.icon.system.mono_lock_reset
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_lock_reset)
JavaScript: tokens.kda.foundation.icon.system.mono_lock_reset
kda.foundation.icon.system.mono_login
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_login)
JavaScript: tokens.kda.foundation.icon.system.mono_login
kda.foundation.icon.system.mono_logo_github
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_logo_github)
JavaScript: tokens.kda.foundation.icon.system.mono_logo_github
kda.foundation.icon.system.mono_logo_linkedin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_logo_linkedin)
JavaScript: tokens.kda.foundation.icon.system.mono_logo_linkedin
kda.foundation.icon.system.mono_logo_x
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_logo_x)
JavaScript: tokens.kda.foundation.icon.system.mono_logo_x
kda.foundation.icon.system.mono_logout
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_logout)
JavaScript: tokens.kda.foundation.icon.system.mono_logout
kda.foundation.icon.system.mono_loop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_loop)
JavaScript: tokens.kda.foundation.icon.system.mono_loop
kda.foundation.icon.system.mono_low_priority
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_low_priority)
JavaScript: tokens.kda.foundation.icon.system.mono_low_priority
kda.foundation.icon.system.mono_loyalty
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_loyalty)
JavaScript: tokens.kda.foundation.icon.system.mono_loyalty
kda.foundation.icon.system.mono_mail
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mail)
JavaScript: tokens.kda.foundation.icon.system.mono_mail
kda.foundation.icon.system.mono_mail_lock
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mail_lock)
JavaScript: tokens.kda.foundation.icon.system.mono_mail_lock
kda.foundation.icon.system.mono_mail_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mail_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_mail_outline
kda.foundation.icon.system.mono_manage_accounts
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_manage_accounts)
JavaScript: tokens.kda.foundation.icon.system.mono_manage_accounts
kda.foundation.icon.system.mono_manage_history
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_manage_history)
JavaScript: tokens.kda.foundation.icon.system.mono_manage_history
kda.foundation.icon.system.mono_manage_search
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_manage_search)
JavaScript: tokens.kda.foundation.icon.system.mono_manage_search
kda.foundation.icon.system.mono_mark_as_unread
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mark_as_unread)
JavaScript: tokens.kda.foundation.icon.system.mono_mark_as_unread
kda.foundation.icon.system.mono_mark_chat_read
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mark_chat_read)
JavaScript: tokens.kda.foundation.icon.system.mono_mark_chat_read
kda.foundation.icon.system.mono_mark_chat_unread
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mark_chat_unread)
JavaScript: tokens.kda.foundation.icon.system.mono_mark_chat_unread
kda.foundation.icon.system.mono_mark_email_read
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mark_email_read)
JavaScript: tokens.kda.foundation.icon.system.mono_mark_email_read
kda.foundation.icon.system.mono_mark_email_unread
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mark_email_unread)
JavaScript: tokens.kda.foundation.icon.system.mono_mark_email_unread
kda.foundation.icon.system.mono_mark_unread_chat_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mark_unread_chat_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_mark_unread_chat_alt
kda.foundation.icon.system.mono_markunread
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_markunread)
JavaScript: tokens.kda.foundation.icon.system.mono_markunread
kda.foundation.icon.system.mono_markunread_mailbox
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_markunread_mailbox)
JavaScript: tokens.kda.foundation.icon.system.mono_markunread_mailbox
kda.foundation.icon.system.mono_mediation
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mediation)
JavaScript: tokens.kda.foundation.icon.system.mono_mediation
kda.foundation.icon.system.mono_medical_information
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_medical_information)
JavaScript: tokens.kda.foundation.icon.system.mono_medical_information
kda.foundation.icon.system.mono_medical_services
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_medical_services)
JavaScript: tokens.kda.foundation.icon.system.mono_medical_services
kda.foundation.icon.system.mono_meeting_room
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_meeting_room)
JavaScript: tokens.kda.foundation.icon.system.mono_meeting_room
kda.foundation.icon.system.mono_memory
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_memory)
JavaScript: tokens.kda.foundation.icon.system.mono_memory
kda.foundation.icon.system.mono_menu
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_menu)
JavaScript: tokens.kda.foundation.icon.system.mono_menu
kda.foundation.icon.system.mono_menu_book
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_menu_book)
JavaScript: tokens.kda.foundation.icon.system.mono_menu_book
kda.foundation.icon.system.mono_menu_open
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_menu_open)
JavaScript: tokens.kda.foundation.icon.system.mono_menu_open
kda.foundation.icon.system.mono_merge
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_merge)
JavaScript: tokens.kda.foundation.icon.system.mono_merge
kda.foundation.icon.system.mono_merge_type
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_merge_type)
JavaScript: tokens.kda.foundation.icon.system.mono_merge_type
kda.foundation.icon.system.mono_message
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_message)
JavaScript: tokens.kda.foundation.icon.system.mono_message
kda.foundation.icon.system.mono_mic
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mic)
JavaScript: tokens.kda.foundation.icon.system.mono_mic
kda.foundation.icon.system.mono_mic_none
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mic_none)
JavaScript: tokens.kda.foundation.icon.system.mono_mic_none
kda.foundation.icon.system.mono_mic_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mic_off)
JavaScript: tokens.kda.foundation.icon.system.mono_mic_off
kda.foundation.icon.system.mono_military_tech
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_military_tech)
JavaScript: tokens.kda.foundation.icon.system.mono_military_tech
kda.foundation.icon.system.mono_miscellaneous_services
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_miscellaneous_services)
JavaScript: tokens.kda.foundation.icon.system.mono_miscellaneous_services
kda.foundation.icon.system.mono_mobile_friendly
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mobile_friendly)
JavaScript: tokens.kda.foundation.icon.system.mono_mobile_friendly
kda.foundation.icon.system.mono_mode_comment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mode_comment)
JavaScript: tokens.kda.foundation.icon.system.mono_mode_comment
kda.foundation.icon.system.mono_monetization_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_monetization_on)
JavaScript: tokens.kda.foundation.icon.system.mono_monetization_on
kda.foundation.icon.system.mono_money_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_money_off)
JavaScript: tokens.kda.foundation.icon.system.mono_money_off
kda.foundation.icon.system.mono_monitor
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_monitor)
JavaScript: tokens.kda.foundation.icon.system.mono_monitor
kda.foundation.icon.system.mono_monitor_heart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_monitor_heart)
JavaScript: tokens.kda.foundation.icon.system.mono_monitor_heart
kda.foundation.icon.system.mono_monochrome_photos
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_monochrome_photos)
JavaScript: tokens.kda.foundation.icon.system.mono_monochrome_photos
kda.foundation.icon.system.mono_mood
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mood)
JavaScript: tokens.kda.foundation.icon.system.mono_mood
kda.foundation.icon.system.mono_mood_bad
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_mood_bad)
JavaScript: tokens.kda.foundation.icon.system.mono_mood_bad
kda.foundation.icon.system.mono_more
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_more)
JavaScript: tokens.kda.foundation.icon.system.mono_more
kda.foundation.icon.system.mono_more_horiz
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_more_horiz)
JavaScript: tokens.kda.foundation.icon.system.mono_more_horiz
kda.foundation.icon.system.mono_more_time
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_more_time)
JavaScript: tokens.kda.foundation.icon.system.mono_more_time
kda.foundation.icon.system.mono_more_vert
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_more_vert)
JavaScript: tokens.kda.foundation.icon.system.mono_more_vert
kda.foundation.icon.system.mono_motion_photos_auto
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_motion_photos_auto)
JavaScript: tokens.kda.foundation.icon.system.mono_motion_photos_auto
kda.foundation.icon.system.mono_motion_photos_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_motion_photos_off)
JavaScript: tokens.kda.foundation.icon.system.mono_motion_photos_off
kda.foundation.icon.system.mono_motion_photos_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_motion_photos_on)
JavaScript: tokens.kda.foundation.icon.system.mono_motion_photos_on
kda.foundation.icon.system.mono_motion_photos_pause
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_motion_photos_pause)
JavaScript: tokens.kda.foundation.icon.system.mono_motion_photos_pause
kda.foundation.icon.system.mono_motion_photos_paused
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_motion_photos_paused)
JavaScript: tokens.kda.foundation.icon.system.mono_motion_photos_paused
kda.foundation.icon.system.mono_move_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_move_down)
JavaScript: tokens.kda.foundation.icon.system.mono_move_down
kda.foundation.icon.system.mono_move_to_inbox
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_move_to_inbox)
JavaScript: tokens.kda.foundation.icon.system.mono_move_to_inbox
kda.foundation.icon.system.mono_move_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_move_up)
JavaScript: tokens.kda.foundation.icon.system.mono_move_up
kda.foundation.icon.system.mono_multiple_stop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_multiple_stop)
JavaScript: tokens.kda.foundation.icon.system.mono_multiple_stop
kda.foundation.icon.system.mono_music_note
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_music_note)
JavaScript: tokens.kda.foundation.icon.system.mono_music_note
kda.foundation.icon.system.mono_music_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_music_off)
JavaScript: tokens.kda.foundation.icon.system.mono_music_off
kda.foundation.icon.system.mono_music_video
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_music_video)
JavaScript: tokens.kda.foundation.icon.system.mono_music_video
kda.foundation.icon.system.mono_my_location
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_my_location)
JavaScript: tokens.kda.foundation.icon.system.mono_my_location
kda.foundation.icon.system.mono_navigate_before
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_navigate_before)
JavaScript: tokens.kda.foundation.icon.system.mono_navigate_before
kda.foundation.icon.system.mono_navigate_next
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_navigate_next)
JavaScript: tokens.kda.foundation.icon.system.mono_navigate_next
kda.foundation.icon.system.mono_navigation
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_navigation)
JavaScript: tokens.kda.foundation.icon.system.mono_navigation
kda.foundation.icon.system.mono_near_me
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_near_me)
JavaScript: tokens.kda.foundation.icon.system.mono_near_me
kda.foundation.icon.system.mono_near_me_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_near_me_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_near_me_disabled
kda.foundation.icon.system.mono_network_cell
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_cell)
JavaScript: tokens.kda.foundation.icon.system.mono_network_cell
kda.foundation.icon.system.mono_network_check
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_check)
JavaScript: tokens.kda.foundation.icon.system.mono_network_check
kda.foundation.icon.system.mono_network_locked
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_locked)
JavaScript: tokens.kda.foundation.icon.system.mono_network_locked
kda.foundation.icon.system.mono_network_ping
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_ping)
JavaScript: tokens.kda.foundation.icon.system.mono_network_ping
kda.foundation.icon.system.mono_network_wifi
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_wifi)
JavaScript: tokens.kda.foundation.icon.system.mono_network_wifi
kda.foundation.icon.system.mono_network_wifi_1_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_wifi_1_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_network_wifi_1_bar
kda.foundation.icon.system.mono_network_wifi_2_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_wifi_2_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_network_wifi_2_bar
kda.foundation.icon.system.mono_network_wifi_3_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_network_wifi_3_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_network_wifi_3_bar
kda.foundation.icon.system.mono_new_label
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_new_label)
JavaScript: tokens.kda.foundation.icon.system.mono_new_label
kda.foundation.icon.system.mono_new_releases
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_new_releases)
JavaScript: tokens.kda.foundation.icon.system.mono_new_releases
kda.foundation.icon.system.mono_next_plan
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_next_plan)
JavaScript: tokens.kda.foundation.icon.system.mono_next_plan
kda.foundation.icon.system.mono_next_week
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_next_week)
JavaScript: tokens.kda.foundation.icon.system.mono_next_week
kda.foundation.icon.system.mono_nfc
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_nfc)
JavaScript: tokens.kda.foundation.icon.system.mono_nfc
kda.foundation.icon.system.mono_no_encryption
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_no_encryption)
JavaScript: tokens.kda.foundation.icon.system.mono_no_encryption
kda.foundation.icon.system.mono_no_encryption_gmailerrorred
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_no_encryption_gmailerrorred)
JavaScript: tokens.kda.foundation.icon.system.mono_no_encryption_gmailerrorred
kda.foundation.icon.system.mono_no_photography
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_no_photography)
JavaScript: tokens.kda.foundation.icon.system.mono_no_photography
kda.foundation.icon.system.mono_north
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_north)
JavaScript: tokens.kda.foundation.icon.system.mono_north
kda.foundation.icon.system.mono_north_east
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_north_east)
JavaScript: tokens.kda.foundation.icon.system.mono_north_east
kda.foundation.icon.system.mono_north_west
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_north_west)
JavaScript: tokens.kda.foundation.icon.system.mono_north_west
kda.foundation.icon.system.mono_not_interested
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_not_interested)
JavaScript: tokens.kda.foundation.icon.system.mono_not_interested
kda.foundation.icon.system.mono_not_listed_location
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_not_listed_location)
JavaScript: tokens.kda.foundation.icon.system.mono_not_listed_location
kda.foundation.icon.system.mono_not_started
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_not_started)
JavaScript: tokens.kda.foundation.icon.system.mono_not_started
kda.foundation.icon.system.mono_note
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_note)
JavaScript: tokens.kda.foundation.icon.system.mono_note
kda.foundation.icon.system.mono_note_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_note_add)
JavaScript: tokens.kda.foundation.icon.system.mono_note_add
kda.foundation.icon.system.mono_note_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_note_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_note_alt
kda.foundation.icon.system.mono_notes
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notes)
JavaScript: tokens.kda.foundation.icon.system.mono_notes
kda.foundation.icon.system.mono_notification_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notification_add)
JavaScript: tokens.kda.foundation.icon.system.mono_notification_add
kda.foundation.icon.system.mono_notification_important
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notification_important)
JavaScript: tokens.kda.foundation.icon.system.mono_notification_important
kda.foundation.icon.system.mono_notifications
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notifications)
JavaScript: tokens.kda.foundation.icon.system.mono_notifications
kda.foundation.icon.system.mono_notifications_active
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notifications_active)
JavaScript: tokens.kda.foundation.icon.system.mono_notifications_active
kda.foundation.icon.system.mono_notifications_none
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notifications_none)
JavaScript: tokens.kda.foundation.icon.system.mono_notifications_none
kda.foundation.icon.system.mono_notifications_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notifications_off)
JavaScript: tokens.kda.foundation.icon.system.mono_notifications_off
kda.foundation.icon.system.mono_notifications_paused
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_notifications_paused)
JavaScript: tokens.kda.foundation.icon.system.mono_notifications_paused
kda.foundation.icon.system.mono_numbers
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_numbers)
JavaScript: tokens.kda.foundation.icon.system.mono_numbers
kda.foundation.icon.system.mono_offline_bolt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_offline_bolt)
JavaScript: tokens.kda.foundation.icon.system.mono_offline_bolt
kda.foundation.icon.system.mono_offline_pin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_offline_pin)
JavaScript: tokens.kda.foundation.icon.system.mono_offline_pin
kda.foundation.icon.system.mono_ondemand_video
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_ondemand_video)
JavaScript: tokens.kda.foundation.icon.system.mono_ondemand_video
kda.foundation.icon.system.mono_online_prediction
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_online_prediction)
JavaScript: tokens.kda.foundation.icon.system.mono_online_prediction
kda.foundation.icon.system.mono_opacity
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_opacity)
JavaScript: tokens.kda.foundation.icon.system.mono_opacity
kda.foundation.icon.system.mono_open_in_browser
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_open_in_browser)
JavaScript: tokens.kda.foundation.icon.system.mono_open_in_browser
kda.foundation.icon.system.mono_open_in_full
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_open_in_full)
JavaScript: tokens.kda.foundation.icon.system.mono_open_in_full
kda.foundation.icon.system.mono_open_in_new
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_open_in_new)
JavaScript: tokens.kda.foundation.icon.system.mono_open_in_new
kda.foundation.icon.system.mono_open_in_new_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_open_in_new_off)
JavaScript: tokens.kda.foundation.icon.system.mono_open_in_new_off
kda.foundation.icon.system.mono_outbound
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_outbound)
JavaScript: tokens.kda.foundation.icon.system.mono_outbound
kda.foundation.icon.system.mono_outgoing_funds
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_outgoing_funds)
JavaScript: tokens.kda.foundation.icon.system.mono_outgoing_funds
kda.foundation.icon.system.mono_outgoing_multichain_funds
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_outgoing_multichain_funds)
JavaScript: tokens.kda.foundation.icon.system.mono_outgoing_multichain_funds
kda.foundation.icon.system.mono_outlined_flag
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_outlined_flag)
JavaScript: tokens.kda.foundation.icon.system.mono_outlined_flag
kda.foundation.icon.system.mono_output
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_output)
JavaScript: tokens.kda.foundation.icon.system.mono_output
kda.foundation.icon.system.mono_padding
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_padding)
JavaScript: tokens.kda.foundation.icon.system.mono_padding
kda.foundation.icon.system.mono_pageview
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pageview)
JavaScript: tokens.kda.foundation.icon.system.mono_pageview
kda.foundation.icon.system.mono_paid
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_paid)
JavaScript: tokens.kda.foundation.icon.system.mono_paid
kda.foundation.icon.system.mono_palette
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_palette)
JavaScript: tokens.kda.foundation.icon.system.mono_palette
kda.foundation.icon.system.mono_pan_tool
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pan_tool)
JavaScript: tokens.kda.foundation.icon.system.mono_pan_tool
kda.foundation.icon.system.mono_pan_tool_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pan_tool_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_pan_tool_alt
kda.foundation.icon.system.mono_panorama_fish_eye
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_panorama_fish_eye)
JavaScript: tokens.kda.foundation.icon.system.mono_panorama_fish_eye
kda.foundation.icon.system.mono_password
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_password)
JavaScript: tokens.kda.foundation.icon.system.mono_password
kda.foundation.icon.system.mono_pause
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pause)
JavaScript: tokens.kda.foundation.icon.system.mono_pause
kda.foundation.icon.system.mono_pause_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pause_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_pause_circle
kda.foundation.icon.system.mono_pause_circle_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pause_circle_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_pause_circle_filled
kda.foundation.icon.system.mono_pause_circle_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pause_circle_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_pause_circle_outline
kda.foundation.icon.system.mono_pause_presentation
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pause_presentation)
JavaScript: tokens.kda.foundation.icon.system.mono_pause_presentation
kda.foundation.icon.system.mono_payment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_payment)
JavaScript: tokens.kda.foundation.icon.system.mono_payment
kda.foundation.icon.system.mono_payments
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_payments)
JavaScript: tokens.kda.foundation.icon.system.mono_payments
kda.foundation.icon.system.mono_pending
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pending)
JavaScript: tokens.kda.foundation.icon.system.mono_pending
kda.foundation.icon.system.mono_people
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_people)
JavaScript: tokens.kda.foundation.icon.system.mono_people
kda.foundation.icon.system.mono_people_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_people_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_people_alt
kda.foundation.icon.system.mono_people_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_people_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_people_outline
kda.foundation.icon.system.mono_percent
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_percent)
JavaScript: tokens.kda.foundation.icon.system.mono_percent
kda.foundation.icon.system.mono_perm_camera_mic
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_camera_mic)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_camera_mic
kda.foundation.icon.system.mono_perm_contact_calendar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_contact_calendar)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_contact_calendar
kda.foundation.icon.system.mono_perm_data_setting
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_data_setting)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_data_setting
kda.foundation.icon.system.mono_perm_device_information
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_device_information)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_device_information
kda.foundation.icon.system.mono_perm_identity
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_identity)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_identity
kda.foundation.icon.system.mono_perm_media
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_media)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_media
kda.foundation.icon.system.mono_perm_phone_msg
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_phone_msg)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_phone_msg
kda.foundation.icon.system.mono_perm_scan_wifi
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_perm_scan_wifi)
JavaScript: tokens.kda.foundation.icon.system.mono_perm_scan_wifi
kda.foundation.icon.system.mono_person
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person)
JavaScript: tokens.kda.foundation.icon.system.mono_person
kda.foundation.icon.system.mono_person_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_2)
JavaScript: tokens.kda.foundation.icon.system.mono_person_2
kda.foundation.icon.system.mono_person_3
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_3)
JavaScript: tokens.kda.foundation.icon.system.mono_person_3
kda.foundation.icon.system.mono_person_4
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_4)
JavaScript: tokens.kda.foundation.icon.system.mono_person_4
kda.foundation.icon.system.mono_person_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_add)
JavaScript: tokens.kda.foundation.icon.system.mono_person_add
kda.foundation.icon.system.mono_person_add_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_add_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_person_add_alt
kda.foundation.icon.system.mono_person_add_alt_1
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_add_alt_1)
JavaScript: tokens.kda.foundation.icon.system.mono_person_add_alt_1
kda.foundation.icon.system.mono_person_add_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_add_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_person_add_disabled
kda.foundation.icon.system.mono_person_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_off)
JavaScript: tokens.kda.foundation.icon.system.mono_person_off
kda.foundation.icon.system.mono_person_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_person_outline
kda.foundation.icon.system.mono_person_pin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_pin)
JavaScript: tokens.kda.foundation.icon.system.mono_person_pin
kda.foundation.icon.system.mono_person_pin_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_pin_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_person_pin_circle
kda.foundation.icon.system.mono_person_remove
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_remove)
JavaScript: tokens.kda.foundation.icon.system.mono_person_remove
kda.foundation.icon.system.mono_person_remove_alt_1
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_remove_alt_1)
JavaScript: tokens.kda.foundation.icon.system.mono_person_remove_alt_1
kda.foundation.icon.system.mono_person_search
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_person_search)
JavaScript: tokens.kda.foundation.icon.system.mono_person_search
kda.foundation.icon.system.mono_pest_control
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pest_control)
JavaScript: tokens.kda.foundation.icon.system.mono_pest_control
kda.foundation.icon.system.mono_phonelink
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_phonelink)
JavaScript: tokens.kda.foundation.icon.system.mono_phonelink
kda.foundation.icon.system.mono_phonelink_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_phonelink_off)
JavaScript: tokens.kda.foundation.icon.system.mono_phonelink_off
kda.foundation.icon.system.mono_picture_as_pdf
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_picture_as_pdf)
JavaScript: tokens.kda.foundation.icon.system.mono_picture_as_pdf
kda.foundation.icon.system.mono_picture_in_picture
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_picture_in_picture)
JavaScript: tokens.kda.foundation.icon.system.mono_picture_in_picture
kda.foundation.icon.system.mono_picture_in_picture_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_picture_in_picture_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_picture_in_picture_alt
kda.foundation.icon.system.mono_pie_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pie_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_pie_chart
kda.foundation.icon.system.mono_pie_chart_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pie_chart_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_pie_chart_outline
kda.foundation.icon.system.mono_pin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pin)
JavaScript: tokens.kda.foundation.icon.system.mono_pin
kda.foundation.icon.system.mono_pin_drop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pin_drop)
JavaScript: tokens.kda.foundation.icon.system.mono_pin_drop
kda.foundation.icon.system.mono_pin_end
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pin_end)
JavaScript: tokens.kda.foundation.icon.system.mono_pin_end
kda.foundation.icon.system.mono_pin_invoke
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pin_invoke)
JavaScript: tokens.kda.foundation.icon.system.mono_pin_invoke
kda.foundation.icon.system.mono_pivot_table_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_pivot_table_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_pivot_table_chart
kda.foundation.icon.system.mono_place
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_place)
JavaScript: tokens.kda.foundation.icon.system.mono_place
kda.foundation.icon.system.mono_plagiarism
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_plagiarism)
JavaScript: tokens.kda.foundation.icon.system.mono_plagiarism
kda.foundation.icon.system.mono_play_arrow
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_play_arrow)
JavaScript: tokens.kda.foundation.icon.system.mono_play_arrow
kda.foundation.icon.system.mono_play_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_play_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_play_circle
kda.foundation.icon.system.mono_play_circle_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_play_circle_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_play_circle_filled
kda.foundation.icon.system.mono_play_circle_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_play_circle_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_play_circle_outline
kda.foundation.icon.system.mono_play_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_play_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_play_disabled
kda.foundation.icon.system.mono_play_for_work
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_play_for_work)
JavaScript: tokens.kda.foundation.icon.system.mono_play_for_work
kda.foundation.icon.system.mono_play_lesson
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_play_lesson)
JavaScript: tokens.kda.foundation.icon.system.mono_play_lesson
kda.foundation.icon.system.mono_playlist_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_playlist_add)
JavaScript: tokens.kda.foundation.icon.system.mono_playlist_add
kda.foundation.icon.system.mono_playlist_add_check
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_playlist_add_check)
JavaScript: tokens.kda.foundation.icon.system.mono_playlist_add_check
kda.foundation.icon.system.mono_playlist_add_check_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_playlist_add_check_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_playlist_add_check_circle
kda.foundation.icon.system.mono_playlist_add_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_playlist_add_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_playlist_add_circle
kda.foundation.icon.system.mono_playlist_play
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_playlist_play)
JavaScript: tokens.kda.foundation.icon.system.mono_playlist_play
kda.foundation.icon.system.mono_playlist_remove
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_playlist_remove)
JavaScript: tokens.kda.foundation.icon.system.mono_playlist_remove
kda.foundation.icon.system.mono_podcasts
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_podcasts)
JavaScript: tokens.kda.foundation.icon.system.mono_podcasts
kda.foundation.icon.system.mono_policy
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_policy)
JavaScript: tokens.kda.foundation.icon.system.mono_policy
kda.foundation.icon.system.mono_poll
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_poll)
JavaScript: tokens.kda.foundation.icon.system.mono_poll
kda.foundation.icon.system.mono_polyline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_polyline)
JavaScript: tokens.kda.foundation.icon.system.mono_polyline
kda.foundation.icon.system.mono_portable_wifi_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_portable_wifi_off)
JavaScript: tokens.kda.foundation.icon.system.mono_portable_wifi_off
kda.foundation.icon.system.mono_portrait
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_portrait)
JavaScript: tokens.kda.foundation.icon.system.mono_portrait
kda.foundation.icon.system.mono_post_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_post_add)
JavaScript: tokens.kda.foundation.icon.system.mono_post_add
kda.foundation.icon.system.mono_power_input
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_power_input)
JavaScript: tokens.kda.foundation.icon.system.mono_power_input
kda.foundation.icon.system.mono_power_settings_new
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_power_settings_new)
JavaScript: tokens.kda.foundation.icon.system.mono_power_settings_new
kda.foundation.icon.system.mono_print
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_print)
JavaScript: tokens.kda.foundation.icon.system.mono_print
kda.foundation.icon.system.mono_print_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_print_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_print_disabled
kda.foundation.icon.system.mono_priority_high
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_priority_high)
JavaScript: tokens.kda.foundation.icon.system.mono_priority_high
kda.foundation.icon.system.mono_privacy_tip
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_privacy_tip)
JavaScript: tokens.kda.foundation.icon.system.mono_privacy_tip
kda.foundation.icon.system.mono_private_connectivity
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_private_connectivity)
JavaScript: tokens.kda.foundation.icon.system.mono_private_connectivity
kda.foundation.icon.system.mono_production_quantity_limits
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_production_quantity_limits)
JavaScript: tokens.kda.foundation.icon.system.mono_production_quantity_limits
kda.foundation.icon.system.mono_public
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_public)
JavaScript: tokens.kda.foundation.icon.system.mono_public
kda.foundation.icon.system.mono_public_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_public_off)
JavaScript: tokens.kda.foundation.icon.system.mono_public_off
kda.foundation.icon.system.mono_push_pin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_push_pin)
JavaScript: tokens.kda.foundation.icon.system.mono_push_pin
kda.foundation.icon.system.mono_qr_code
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_qr_code)
JavaScript: tokens.kda.foundation.icon.system.mono_qr_code
kda.foundation.icon.system.mono_qr_code_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_qr_code_2)
JavaScript: tokens.kda.foundation.icon.system.mono_qr_code_2
kda.foundation.icon.system.mono_qr_code_scanner
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_qr_code_scanner)
JavaScript: tokens.kda.foundation.icon.system.mono_qr_code_scanner
kda.foundation.icon.system.mono_query_builder
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_query_builder)
JavaScript: tokens.kda.foundation.icon.system.mono_query_builder
kda.foundation.icon.system.mono_query_stats
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_query_stats)
JavaScript: tokens.kda.foundation.icon.system.mono_query_stats
kda.foundation.icon.system.mono_question_answer
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_question_answer)
JavaScript: tokens.kda.foundation.icon.system.mono_question_answer
kda.foundation.icon.system.mono_question_mark
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_question_mark)
JavaScript: tokens.kda.foundation.icon.system.mono_question_mark
kda.foundation.icon.system.mono_queue
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_queue)
JavaScript: tokens.kda.foundation.icon.system.mono_queue
kda.foundation.icon.system.mono_queue_music
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_queue_music)
JavaScript: tokens.kda.foundation.icon.system.mono_queue_music
kda.foundation.icon.system.mono_queue_play_next
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_queue_play_next)
JavaScript: tokens.kda.foundation.icon.system.mono_queue_play_next
kda.foundation.icon.system.mono_radar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_radar)
JavaScript: tokens.kda.foundation.icon.system.mono_radar
kda.foundation.icon.system.mono_radio_button_checked
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_radio_button_checked)
JavaScript: tokens.kda.foundation.icon.system.mono_radio_button_checked
kda.foundation.icon.system.mono_radio_button_unchecked
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_radio_button_unchecked)
JavaScript: tokens.kda.foundation.icon.system.mono_radio_button_unchecked
kda.foundation.icon.system.mono_recommend
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_recommend)
JavaScript: tokens.kda.foundation.icon.system.mono_recommend
kda.foundation.icon.system.mono_record_voice_over
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_record_voice_over)
JavaScript: tokens.kda.foundation.icon.system.mono_record_voice_over
kda.foundation.icon.system.mono_rectangle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rectangle)
JavaScript: tokens.kda.foundation.icon.system.mono_rectangle
kda.foundation.icon.system.mono_recycling
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_recycling)
JavaScript: tokens.kda.foundation.icon.system.mono_recycling
kda.foundation.icon.system.mono_redeem
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_redeem)
JavaScript: tokens.kda.foundation.icon.system.mono_redeem
kda.foundation.icon.system.mono_redo
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_redo)
JavaScript: tokens.kda.foundation.icon.system.mono_redo
kda.foundation.icon.system.mono_reduce_capacity
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_reduce_capacity)
JavaScript: tokens.kda.foundation.icon.system.mono_reduce_capacity
kda.foundation.icon.system.mono_refresh
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_refresh)
JavaScript: tokens.kda.foundation.icon.system.mono_refresh
kda.foundation.icon.system.mono_remember_me
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remember_me)
JavaScript: tokens.kda.foundation.icon.system.mono_remember_me
kda.foundation.icon.system.mono_remove
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove)
JavaScript: tokens.kda.foundation.icon.system.mono_remove
kda.foundation.icon.system.mono_remove_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_circle
kda.foundation.icon.system.mono_remove_circle_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_circle_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_circle_outline
kda.foundation.icon.system.mono_remove_done
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_done)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_done
kda.foundation.icon.system.mono_remove_from_queue
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_from_queue)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_from_queue
kda.foundation.icon.system.mono_remove_moderator
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_moderator)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_moderator
kda.foundation.icon.system.mono_remove_red_eye
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_red_eye)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_red_eye
kda.foundation.icon.system.mono_remove_road
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_road)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_road
kda.foundation.icon.system.mono_remove_shopping_cart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_remove_shopping_cart)
JavaScript: tokens.kda.foundation.icon.system.mono_remove_shopping_cart
kda.foundation.icon.system.mono_reorder
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_reorder)
JavaScript: tokens.kda.foundation.icon.system.mono_reorder
kda.foundation.icon.system.mono_repartition
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_repartition)
JavaScript: tokens.kda.foundation.icon.system.mono_repartition
kda.foundation.icon.system.mono_repeat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_repeat)
JavaScript: tokens.kda.foundation.icon.system.mono_repeat
kda.foundation.icon.system.mono_repeat_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_repeat_on)
JavaScript: tokens.kda.foundation.icon.system.mono_repeat_on
kda.foundation.icon.system.mono_repeat_one
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_repeat_one)
JavaScript: tokens.kda.foundation.icon.system.mono_repeat_one
kda.foundation.icon.system.mono_repeat_one_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_repeat_one_on)
JavaScript: tokens.kda.foundation.icon.system.mono_repeat_one_on
kda.foundation.icon.system.mono_replay
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_replay)
JavaScript: tokens.kda.foundation.icon.system.mono_replay
kda.foundation.icon.system.mono_replay_10
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_replay_10)
JavaScript: tokens.kda.foundation.icon.system.mono_replay_10
kda.foundation.icon.system.mono_replay_30
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_replay_30)
JavaScript: tokens.kda.foundation.icon.system.mono_replay_30
kda.foundation.icon.system.mono_replay_5
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_replay_5)
JavaScript: tokens.kda.foundation.icon.system.mono_replay_5
kda.foundation.icon.system.mono_replay_circle_filled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_replay_circle_filled)
JavaScript: tokens.kda.foundation.icon.system.mono_replay_circle_filled
kda.foundation.icon.system.mono_reply
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_reply)
JavaScript: tokens.kda.foundation.icon.system.mono_reply
kda.foundation.icon.system.mono_reply_all
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_reply_all)
JavaScript: tokens.kda.foundation.icon.system.mono_reply_all
kda.foundation.icon.system.mono_report
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_report)
JavaScript: tokens.kda.foundation.icon.system.mono_report
kda.foundation.icon.system.mono_report_gmailerrorred
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_report_gmailerrorred)
JavaScript: tokens.kda.foundation.icon.system.mono_report_gmailerrorred
kda.foundation.icon.system.mono_report_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_report_off)
JavaScript: tokens.kda.foundation.icon.system.mono_report_off
kda.foundation.icon.system.mono_report_problem
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_report_problem)
JavaScript: tokens.kda.foundation.icon.system.mono_report_problem
kda.foundation.icon.system.mono_request_page
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_request_page)
JavaScript: tokens.kda.foundation.icon.system.mono_request_page
kda.foundation.icon.system.mono_request_quote
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_request_quote)
JavaScript: tokens.kda.foundation.icon.system.mono_request_quote
kda.foundation.icon.system.mono_reset_tv
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_reset_tv)
JavaScript: tokens.kda.foundation.icon.system.mono_reset_tv
kda.foundation.icon.system.mono_restart_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_restart_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_restart_alt
kda.foundation.icon.system.mono_restore
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_restore)
JavaScript: tokens.kda.foundation.icon.system.mono_restore
kda.foundation.icon.system.mono_restore_from_trash
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_restore_from_trash)
JavaScript: tokens.kda.foundation.icon.system.mono_restore_from_trash
kda.foundation.icon.system.mono_restore_page
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_restore_page)
JavaScript: tokens.kda.foundation.icon.system.mono_restore_page
kda.foundation.icon.system.mono_reviews
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_reviews)
JavaScript: tokens.kda.foundation.icon.system.mono_reviews
kda.foundation.icon.system.mono_rocket
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rocket)
JavaScript: tokens.kda.foundation.icon.system.mono_rocket
kda.foundation.icon.system.mono_rocket_launch
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rocket_launch)
JavaScript: tokens.kda.foundation.icon.system.mono_rocket_launch
kda.foundation.icon.system.mono_roller_shades
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_roller_shades)
JavaScript: tokens.kda.foundation.icon.system.mono_roller_shades
kda.foundation.icon.system.mono_roller_shades_closed
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_roller_shades_closed)
JavaScript: tokens.kda.foundation.icon.system.mono_roller_shades_closed
kda.foundation.icon.system.mono_roofing
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_roofing)
JavaScript: tokens.kda.foundation.icon.system.mono_roofing
kda.foundation.icon.system.mono_room
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_room)
JavaScript: tokens.kda.foundation.icon.system.mono_room
kda.foundation.icon.system.mono_room_preferences
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_room_preferences)
JavaScript: tokens.kda.foundation.icon.system.mono_room_preferences
kda.foundation.icon.system.mono_room_service
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_room_service)
JavaScript: tokens.kda.foundation.icon.system.mono_room_service
kda.foundation.icon.system.mono_rotate_90_degrees_ccw
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rotate_90_degrees_ccw)
JavaScript: tokens.kda.foundation.icon.system.mono_rotate_90_degrees_ccw
kda.foundation.icon.system.mono_rotate_90_degrees_cw
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rotate_90_degrees_cw)
JavaScript: tokens.kda.foundation.icon.system.mono_rotate_90_degrees_cw
kda.foundation.icon.system.mono_rotate_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rotate_left)
JavaScript: tokens.kda.foundation.icon.system.mono_rotate_left
kda.foundation.icon.system.mono_rotate_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rotate_right)
JavaScript: tokens.kda.foundation.icon.system.mono_rotate_right
kda.foundation.icon.system.mono_roundabout_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_roundabout_left)
JavaScript: tokens.kda.foundation.icon.system.mono_roundabout_left
kda.foundation.icon.system.mono_roundabout_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_roundabout_right)
JavaScript: tokens.kda.foundation.icon.system.mono_roundabout_right
kda.foundation.icon.system.mono_rounded_corner
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rounded_corner)
JavaScript: tokens.kda.foundation.icon.system.mono_rounded_corner
kda.foundation.icon.system.mono_route
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_route)
JavaScript: tokens.kda.foundation.icon.system.mono_route
kda.foundation.icon.system.mono_router
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_router)
JavaScript: tokens.kda.foundation.icon.system.mono_router
kda.foundation.icon.system.mono_rss_feed
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rss_feed)
JavaScript: tokens.kda.foundation.icon.system.mono_rss_feed
kda.foundation.icon.system.mono_rsvp
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rsvp)
JavaScript: tokens.kda.foundation.icon.system.mono_rsvp
kda.foundation.icon.system.mono_rtt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rtt)
JavaScript: tokens.kda.foundation.icon.system.mono_rtt
kda.foundation.icon.system.mono_rule
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rule)
JavaScript: tokens.kda.foundation.icon.system.mono_rule
kda.foundation.icon.system.mono_rule_folder
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_rule_folder)
JavaScript: tokens.kda.foundation.icon.system.mono_rule_folder
kda.foundation.icon.system.mono_safety_check
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_safety_check)
JavaScript: tokens.kda.foundation.icon.system.mono_safety_check
kda.foundation.icon.system.mono_safety_divider
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_safety_divider)
JavaScript: tokens.kda.foundation.icon.system.mono_safety_divider
kda.foundation.icon.system.mono_satellite_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_satellite_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_satellite_alt
kda.foundation.icon.system.mono_save
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_save)
JavaScript: tokens.kda.foundation.icon.system.mono_save
kda.foundation.icon.system.mono_save_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_save_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_save_alt
kda.foundation.icon.system.mono_save_as
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_save_as)
JavaScript: tokens.kda.foundation.icon.system.mono_save_as
kda.foundation.icon.system.mono_saved_search
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_saved_search)
JavaScript: tokens.kda.foundation.icon.system.mono_saved_search
kda.foundation.icon.system.mono_schedule
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_schedule)
JavaScript: tokens.kda.foundation.icon.system.mono_schedule
kda.foundation.icon.system.mono_school
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_school)
JavaScript: tokens.kda.foundation.icon.system.mono_school
kda.foundation.icon.system.mono_science
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_science)
JavaScript: tokens.kda.foundation.icon.system.mono_science
kda.foundation.icon.system.mono_score
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_score)
JavaScript: tokens.kda.foundation.icon.system.mono_score
kda.foundation.icon.system.mono_scoreboard
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_scoreboard)
JavaScript: tokens.kda.foundation.icon.system.mono_scoreboard
kda.foundation.icon.system.mono_screen_lock_rotation
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_screen_lock_rotation)
JavaScript: tokens.kda.foundation.icon.system.mono_screen_lock_rotation
kda.foundation.icon.system.mono_screen_rotation_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_screen_rotation_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_screen_rotation_alt
kda.foundation.icon.system.mono_screen_search_desktop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_screen_search_desktop)
JavaScript: tokens.kda.foundation.icon.system.mono_screen_search_desktop
kda.foundation.icon.system.mono_screen_share
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_screen_share)
JavaScript: tokens.kda.foundation.icon.system.mono_screen_share
kda.foundation.icon.system.mono_screenshot_monitor
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_screenshot_monitor)
JavaScript: tokens.kda.foundation.icon.system.mono_screenshot_monitor
kda.foundation.icon.system.mono_sd
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sd)
JavaScript: tokens.kda.foundation.icon.system.mono_sd
kda.foundation.icon.system.mono_sd_card
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sd_card)
JavaScript: tokens.kda.foundation.icon.system.mono_sd_card
kda.foundation.icon.system.mono_sd_card_alert
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sd_card_alert)
JavaScript: tokens.kda.foundation.icon.system.mono_sd_card_alert
kda.foundation.icon.system.mono_sd_storage
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sd_storage)
JavaScript: tokens.kda.foundation.icon.system.mono_sd_storage
kda.foundation.icon.system.mono_search
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_search)
JavaScript: tokens.kda.foundation.icon.system.mono_search
kda.foundation.icon.system.mono_search_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_search_off)
JavaScript: tokens.kda.foundation.icon.system.mono_search_off
kda.foundation.icon.system.mono_security
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_security)
JavaScript: tokens.kda.foundation.icon.system.mono_security
kda.foundation.icon.system.mono_segment
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_segment)
JavaScript: tokens.kda.foundation.icon.system.mono_segment
kda.foundation.icon.system.mono_select_all
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_select_all)
JavaScript: tokens.kda.foundation.icon.system.mono_select_all
kda.foundation.icon.system.mono_sell
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sell)
JavaScript: tokens.kda.foundation.icon.system.mono_sell
kda.foundation.icon.system.mono_sensors
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sensors)
JavaScript: tokens.kda.foundation.icon.system.mono_sensors
kda.foundation.icon.system.mono_sensors_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sensors_off)
JavaScript: tokens.kda.foundation.icon.system.mono_sensors_off
kda.foundation.icon.system.mono_sentiment_dissatisfied
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sentiment_dissatisfied)
JavaScript: tokens.kda.foundation.icon.system.mono_sentiment_dissatisfied
kda.foundation.icon.system.mono_sentiment_neutral
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sentiment_neutral)
JavaScript: tokens.kda.foundation.icon.system.mono_sentiment_neutral
kda.foundation.icon.system.mono_sentiment_satisfied
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sentiment_satisfied)
JavaScript: tokens.kda.foundation.icon.system.mono_sentiment_satisfied
kda.foundation.icon.system.mono_sentiment_satisfied_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sentiment_satisfied_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_sentiment_satisfied_alt
kda.foundation.icon.system.mono_sentiment_very_dissatisfied
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sentiment_very_dissatisfied)
JavaScript: tokens.kda.foundation.icon.system.mono_sentiment_very_dissatisfied
kda.foundation.icon.system.mono_sentiment_very_satisfied
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sentiment_very_satisfied)
JavaScript: tokens.kda.foundation.icon.system.mono_sentiment_very_satisfied
kda.foundation.icon.system.mono_settings
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings)
JavaScript: tokens.kda.foundation.icon.system.mono_settings
kda.foundation.icon.system.mono_settings_applications
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings_applications)
JavaScript: tokens.kda.foundation.icon.system.mono_settings_applications
kda.foundation.icon.system.mono_settings_backup_restore
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings_backup_restore)
JavaScript: tokens.kda.foundation.icon.system.mono_settings_backup_restore
kda.foundation.icon.system.mono_settings_bluetooth
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings_bluetooth)
JavaScript: tokens.kda.foundation.icon.system.mono_settings_bluetooth
kda.foundation.icon.system.mono_settings_ethernet
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings_ethernet)
JavaScript: tokens.kda.foundation.icon.system.mono_settings_ethernet
kda.foundation.icon.system.mono_settings_input_antenna
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings_input_antenna)
JavaScript: tokens.kda.foundation.icon.system.mono_settings_input_antenna
kda.foundation.icon.system.mono_settings_input_component
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings_input_component)
JavaScript: tokens.kda.foundation.icon.system.mono_settings_input_component
kda.foundation.icon.system.mono_settings_suggest
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_settings_suggest)
JavaScript: tokens.kda.foundation.icon.system.mono_settings_suggest
kda.foundation.icon.system.mono_share
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_share)
JavaScript: tokens.kda.foundation.icon.system.mono_share
kda.foundation.icon.system.mono_share_location
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_share_location)
JavaScript: tokens.kda.foundation.icon.system.mono_share_location
kda.foundation.icon.system.mono_shield
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shield)
JavaScript: tokens.kda.foundation.icon.system.mono_shield
kda.foundation.icon.system.mono_shield_moon
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shield_moon)
JavaScript: tokens.kda.foundation.icon.system.mono_shield_moon
kda.foundation.icon.system.mono_shop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shop)
JavaScript: tokens.kda.foundation.icon.system.mono_shop
kda.foundation.icon.system.mono_shop_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shop_2)
JavaScript: tokens.kda.foundation.icon.system.mono_shop_2
kda.foundation.icon.system.mono_shop_two
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shop_two)
JavaScript: tokens.kda.foundation.icon.system.mono_shop_two
kda.foundation.icon.system.mono_shopping_bag
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shopping_bag)
JavaScript: tokens.kda.foundation.icon.system.mono_shopping_bag
kda.foundation.icon.system.mono_shopping_basket
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shopping_basket)
JavaScript: tokens.kda.foundation.icon.system.mono_shopping_basket
kda.foundation.icon.system.mono_shopping_cart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shopping_cart)
JavaScript: tokens.kda.foundation.icon.system.mono_shopping_cart
kda.foundation.icon.system.mono_shopping_cart_checkout
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shopping_cart_checkout)
JavaScript: tokens.kda.foundation.icon.system.mono_shopping_cart_checkout
kda.foundation.icon.system.mono_short_text
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_short_text)
JavaScript: tokens.kda.foundation.icon.system.mono_short_text
kda.foundation.icon.system.mono_shortcut
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shortcut)
JavaScript: tokens.kda.foundation.icon.system.mono_shortcut
kda.foundation.icon.system.mono_show_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_show_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_show_chart
kda.foundation.icon.system.mono_shower
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shower)
JavaScript: tokens.kda.foundation.icon.system.mono_shower
kda.foundation.icon.system.mono_shuffle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shuffle)
JavaScript: tokens.kda.foundation.icon.system.mono_shuffle
kda.foundation.icon.system.mono_shuffle_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_shuffle_on)
JavaScript: tokens.kda.foundation.icon.system.mono_shuffle_on
kda.foundation.icon.system.mono_signal_cellular_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_signal_cellular_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_signal_cellular_alt
kda.foundation.icon.system.mono_signal_cellular_alt_1_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_signal_cellular_alt_1_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_signal_cellular_alt_1_bar
kda.foundation.icon.system.mono_signal_cellular_alt_2_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_signal_cellular_alt_2_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_signal_cellular_alt_2_bar
kda.foundation.icon.system.mono_signature
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_signature)
JavaScript: tokens.kda.foundation.icon.system.mono_signature
kda.foundation.icon.system.mono_signature_not_allowed
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_signature_not_allowed)
JavaScript: tokens.kda.foundation.icon.system.mono_signature_not_allowed
kda.foundation.icon.system.mono_signpost
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_signpost)
JavaScript: tokens.kda.foundation.icon.system.mono_signpost
kda.foundation.icon.system.mono_sim_card
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sim_card)
JavaScript: tokens.kda.foundation.icon.system.mono_sim_card
kda.foundation.icon.system.mono_sim_card_alert
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sim_card_alert)
JavaScript: tokens.kda.foundation.icon.system.mono_sim_card_alert
kda.foundation.icon.system.mono_sim_card_download
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sim_card_download)
JavaScript: tokens.kda.foundation.icon.system.mono_sim_card_download
kda.foundation.icon.system.mono_skip_next
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_skip_next)
JavaScript: tokens.kda.foundation.icon.system.mono_skip_next
kda.foundation.icon.system.mono_skip_previous
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_skip_previous)
JavaScript: tokens.kda.foundation.icon.system.mono_skip_previous
kda.foundation.icon.system.mono_slash_forward
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_slash_forward)
JavaScript: tokens.kda.foundation.icon.system.mono_slash_forward
kda.foundation.icon.system.mono_slideshow
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_slideshow)
JavaScript: tokens.kda.foundation.icon.system.mono_slideshow
kda.foundation.icon.system.mono_slow_motion_video
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_slow_motion_video)
JavaScript: tokens.kda.foundation.icon.system.mono_slow_motion_video
kda.foundation.icon.system.mono_smart_button
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_smart_button)
JavaScript: tokens.kda.foundation.icon.system.mono_smart_button
kda.foundation.icon.system.mono_smart_display
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_smart_display)
JavaScript: tokens.kda.foundation.icon.system.mono_smart_display
kda.foundation.icon.system.mono_sms
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sms)
JavaScript: tokens.kda.foundation.icon.system.mono_sms
kda.foundation.icon.system.mono_sms_failed
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sms_failed)
JavaScript: tokens.kda.foundation.icon.system.mono_sms_failed
kda.foundation.icon.system.mono_snippet_folder
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_snippet_folder)
JavaScript: tokens.kda.foundation.icon.system.mono_snippet_folder
kda.foundation.icon.system.mono_snooze
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_snooze)
JavaScript: tokens.kda.foundation.icon.system.mono_snooze
kda.foundation.icon.system.mono_social_distance
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_social_distance)
JavaScript: tokens.kda.foundation.icon.system.mono_social_distance
kda.foundation.icon.system.mono_sort
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sort)
JavaScript: tokens.kda.foundation.icon.system.mono_sort
kda.foundation.icon.system.mono_sort_by_alpha
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sort_by_alpha)
JavaScript: tokens.kda.foundation.icon.system.mono_sort_by_alpha
kda.foundation.icon.system.mono_south
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_south)
JavaScript: tokens.kda.foundation.icon.system.mono_south
kda.foundation.icon.system.mono_south_america
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_south_america)
JavaScript: tokens.kda.foundation.icon.system.mono_south_america
kda.foundation.icon.system.mono_south_east
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_south_east)
JavaScript: tokens.kda.foundation.icon.system.mono_south_east
kda.foundation.icon.system.mono_south_west
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_south_west)
JavaScript: tokens.kda.foundation.icon.system.mono_south_west
kda.foundation.icon.system.mono_spellcheck
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_spellcheck)
JavaScript: tokens.kda.foundation.icon.system.mono_spellcheck
kda.foundation.icon.system.mono_splitscreen
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_splitscreen)
JavaScript: tokens.kda.foundation.icon.system.mono_splitscreen
kda.foundation.icon.system.mono_star
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_star)
JavaScript: tokens.kda.foundation.icon.system.mono_star
kda.foundation.icon.system.mono_star_border
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_star_border)
JavaScript: tokens.kda.foundation.icon.system.mono_star_border
kda.foundation.icon.system.mono_star_half
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_star_half)
JavaScript: tokens.kda.foundation.icon.system.mono_star_half
kda.foundation.icon.system.mono_star_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_star_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_star_outline
kda.foundation.icon.system.mono_stars
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_stars)
JavaScript: tokens.kda.foundation.icon.system.mono_stars
kda.foundation.icon.system.mono_start
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_start)
JavaScript: tokens.kda.foundation.icon.system.mono_start
kda.foundation.icon.system.mono_sticky_note_2
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sticky_note_2)
JavaScript: tokens.kda.foundation.icon.system.mono_sticky_note_2
kda.foundation.icon.system.mono_stop
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_stop)
JavaScript: tokens.kda.foundation.icon.system.mono_stop
kda.foundation.icon.system.mono_stop_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_stop_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_stop_circle
kda.foundation.icon.system.mono_stop_screen_share
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_stop_screen_share)
JavaScript: tokens.kda.foundation.icon.system.mono_stop_screen_share
kda.foundation.icon.system.mono_storage
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_storage)
JavaScript: tokens.kda.foundation.icon.system.mono_storage
kda.foundation.icon.system.mono_store
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_store)
JavaScript: tokens.kda.foundation.icon.system.mono_store
kda.foundation.icon.system.mono_store_mall_directory
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_store_mall_directory)
JavaScript: tokens.kda.foundation.icon.system.mono_store_mall_directory
kda.foundation.icon.system.mono_storefront
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_storefront)
JavaScript: tokens.kda.foundation.icon.system.mono_storefront
kda.foundation.icon.system.mono_straight
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_straight)
JavaScript: tokens.kda.foundation.icon.system.mono_straight
kda.foundation.icon.system.mono_straighten
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_straighten)
JavaScript: tokens.kda.foundation.icon.system.mono_straighten
kda.foundation.icon.system.mono_subdirectory_arrow_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_subdirectory_arrow_left)
JavaScript: tokens.kda.foundation.icon.system.mono_subdirectory_arrow_left
kda.foundation.icon.system.mono_subdirectory_arrow_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_subdirectory_arrow_right)
JavaScript: tokens.kda.foundation.icon.system.mono_subdirectory_arrow_right
kda.foundation.icon.system.mono_subject
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_subject)
JavaScript: tokens.kda.foundation.icon.system.mono_subject
kda.foundation.icon.system.mono_subscript
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_subscript)
JavaScript: tokens.kda.foundation.icon.system.mono_subscript
kda.foundation.icon.system.mono_subscriptions
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_subscriptions)
JavaScript: tokens.kda.foundation.icon.system.mono_subscriptions
kda.foundation.icon.system.mono_subtitles
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_subtitles)
JavaScript: tokens.kda.foundation.icon.system.mono_subtitles
kda.foundation.icon.system.mono_subtitles_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_subtitles_off)
JavaScript: tokens.kda.foundation.icon.system.mono_subtitles_off
kda.foundation.icon.system.mono_superscript
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_superscript)
JavaScript: tokens.kda.foundation.icon.system.mono_superscript
kda.foundation.icon.system.mono_supervised_user_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_supervised_user_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_supervised_user_circle
kda.foundation.icon.system.mono_supervisor_account
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_supervisor_account)
JavaScript: tokens.kda.foundation.icon.system.mono_supervisor_account
kda.foundation.icon.system.mono_support
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_support)
JavaScript: tokens.kda.foundation.icon.system.mono_support
kda.foundation.icon.system.mono_support_agent
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_support_agent)
JavaScript: tokens.kda.foundation.icon.system.mono_support_agent
kda.foundation.icon.system.mono_swap_calls
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swap_calls)
JavaScript: tokens.kda.foundation.icon.system.mono_swap_calls
kda.foundation.icon.system.mono_swap_horiz
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swap_horiz)
JavaScript: tokens.kda.foundation.icon.system.mono_swap_horiz
kda.foundation.icon.system.mono_swap_horizontal_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swap_horizontal_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_swap_horizontal_circle
kda.foundation.icon.system.mono_swap_vert
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swap_vert)
JavaScript: tokens.kda.foundation.icon.system.mono_swap_vert
kda.foundation.icon.system.mono_swap_vertical_circle
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swap_vertical_circle)
JavaScript: tokens.kda.foundation.icon.system.mono_swap_vertical_circle
kda.foundation.icon.system.mono_swipe
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe
kda.foundation.icon.system.mono_swipe_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_down)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_down
kda.foundation.icon.system.mono_swipe_down_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_down_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_down_alt
kda.foundation.icon.system.mono_swipe_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_left)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_left
kda.foundation.icon.system.mono_swipe_left_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_left_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_left_alt
kda.foundation.icon.system.mono_swipe_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_right)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_right
kda.foundation.icon.system.mono_swipe_right_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_right_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_right_alt
kda.foundation.icon.system.mono_swipe_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_up)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_up
kda.foundation.icon.system.mono_swipe_up_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_up_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_up_alt
kda.foundation.icon.system.mono_swipe_vertical
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_swipe_vertical)
JavaScript: tokens.kda.foundation.icon.system.mono_swipe_vertical
kda.foundation.icon.system.mono_switch_access_shortcut
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_switch_access_shortcut)
JavaScript: tokens.kda.foundation.icon.system.mono_switch_access_shortcut
kda.foundation.icon.system.mono_switch_access_shortcut_add
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_switch_access_shortcut_add)
JavaScript: tokens.kda.foundation.icon.system.mono_switch_access_shortcut_add
kda.foundation.icon.system.mono_switch_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_switch_left)
JavaScript: tokens.kda.foundation.icon.system.mono_switch_left
kda.foundation.icon.system.mono_switch_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_switch_right)
JavaScript: tokens.kda.foundation.icon.system.mono_switch_right
kda.foundation.icon.system.mono_sync
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sync)
JavaScript: tokens.kda.foundation.icon.system.mono_sync
kda.foundation.icon.system.mono_sync_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sync_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_sync_alt
kda.foundation.icon.system.mono_sync_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sync_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_sync_disabled
kda.foundation.icon.system.mono_sync_lock
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sync_lock)
JavaScript: tokens.kda.foundation.icon.system.mono_sync_lock
kda.foundation.icon.system.mono_sync_problem
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_sync_problem)
JavaScript: tokens.kda.foundation.icon.system.mono_sync_problem
kda.foundation.icon.system.mono_system_update_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_system_update_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_system_update_alt
kda.foundation.icon.system.mono_tab
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_tab)
JavaScript: tokens.kda.foundation.icon.system.mono_tab
kda.foundation.icon.system.mono_tab_unselected
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_tab_unselected)
JavaScript: tokens.kda.foundation.icon.system.mono_tab_unselected
kda.foundation.icon.system.mono_table_rows
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_table_rows)
JavaScript: tokens.kda.foundation.icon.system.mono_table_rows
kda.foundation.icon.system.mono_task
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_task)
JavaScript: tokens.kda.foundation.icon.system.mono_task
kda.foundation.icon.system.mono_task_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_task_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_task_alt
kda.foundation.icon.system.mono_terminal
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_terminal)
JavaScript: tokens.kda.foundation.icon.system.mono_terminal
kda.foundation.icon.system.mono_text_decrease
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_decrease)
JavaScript: tokens.kda.foundation.icon.system.mono_text_decrease
kda.foundation.icon.system.mono_text_fields
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_fields)
JavaScript: tokens.kda.foundation.icon.system.mono_text_fields
kda.foundation.icon.system.mono_text_format
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_format)
JavaScript: tokens.kda.foundation.icon.system.mono_text_format
kda.foundation.icon.system.mono_text_increase
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_increase)
JavaScript: tokens.kda.foundation.icon.system.mono_text_increase
kda.foundation.icon.system.mono_text_rotate_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_rotate_up)
JavaScript: tokens.kda.foundation.icon.system.mono_text_rotate_up
kda.foundation.icon.system.mono_text_rotate_vertical
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_rotate_vertical)
JavaScript: tokens.kda.foundation.icon.system.mono_text_rotate_vertical
kda.foundation.icon.system.mono_text_rotation_angledown
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_rotation_angledown)
JavaScript: tokens.kda.foundation.icon.system.mono_text_rotation_angledown
kda.foundation.icon.system.mono_text_rotation_angleup
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_rotation_angleup)
JavaScript: tokens.kda.foundation.icon.system.mono_text_rotation_angleup
kda.foundation.icon.system.mono_text_rotation_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_rotation_down)
JavaScript: tokens.kda.foundation.icon.system.mono_text_rotation_down
kda.foundation.icon.system.mono_text_rotation_none
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_rotation_none)
JavaScript: tokens.kda.foundation.icon.system.mono_text_rotation_none
kda.foundation.icon.system.mono_text_snippet
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_text_snippet)
JavaScript: tokens.kda.foundation.icon.system.mono_text_snippet
kda.foundation.icon.system.mono_textsms
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_textsms)
JavaScript: tokens.kda.foundation.icon.system.mono_textsms
kda.foundation.icon.system.mono_texture
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_texture)
JavaScript: tokens.kda.foundation.icon.system.mono_texture
kda.foundation.icon.system.mono_thermostat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thermostat)
JavaScript: tokens.kda.foundation.icon.system.mono_thermostat
kda.foundation.icon.system.mono_thermostat_auto
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thermostat_auto)
JavaScript: tokens.kda.foundation.icon.system.mono_thermostat_auto
kda.foundation.icon.system.mono_thumb_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thumb_down)
JavaScript: tokens.kda.foundation.icon.system.mono_thumb_down
kda.foundation.icon.system.mono_thumb_down_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thumb_down_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_thumb_down_alt
kda.foundation.icon.system.mono_thumb_down_off_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thumb_down_off_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_thumb_down_off_alt
kda.foundation.icon.system.mono_thumb_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thumb_up)
JavaScript: tokens.kda.foundation.icon.system.mono_thumb_up
kda.foundation.icon.system.mono_thumb_up_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thumb_up_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_thumb_up_alt
kda.foundation.icon.system.mono_thumb_up_off_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thumb_up_off_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_thumb_up_off_alt
kda.foundation.icon.system.mono_thumbs_up_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_thumbs_up_down)
JavaScript: tokens.kda.foundation.icon.system.mono_thumbs_up_down
kda.foundation.icon.system.mono_timelapse
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_timelapse)
JavaScript: tokens.kda.foundation.icon.system.mono_timelapse
kda.foundation.icon.system.mono_toggle_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_toggle_off)
JavaScript: tokens.kda.foundation.icon.system.mono_toggle_off
kda.foundation.icon.system.mono_toggle_on
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_toggle_on)
JavaScript: tokens.kda.foundation.icon.system.mono_toggle_on
kda.foundation.icon.system.mono_toll
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_toll)
JavaScript: tokens.kda.foundation.icon.system.mono_toll
kda.foundation.icon.system.mono_touch_app
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_touch_app)
JavaScript: tokens.kda.foundation.icon.system.mono_touch_app
kda.foundation.icon.system.mono_tour
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_tour)
JavaScript: tokens.kda.foundation.icon.system.mono_tour
kda.foundation.icon.system.mono_transform
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_transform)
JavaScript: tokens.kda.foundation.icon.system.mono_transform
kda.foundation.icon.system.mono_translate
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_translate)
JavaScript: tokens.kda.foundation.icon.system.mono_translate
kda.foundation.icon.system.mono_travel_explore
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_travel_explore)
JavaScript: tokens.kda.foundation.icon.system.mono_travel_explore
kda.foundation.icon.system.mono_trending_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_trending_down)
JavaScript: tokens.kda.foundation.icon.system.mono_trending_down
kda.foundation.icon.system.mono_trending_flat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_trending_flat)
JavaScript: tokens.kda.foundation.icon.system.mono_trending_flat
kda.foundation.icon.system.mono_trending_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_trending_up)
JavaScript: tokens.kda.foundation.icon.system.mono_trending_up
kda.foundation.icon.system.mono_trip_origin
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_trip_origin)
JavaScript: tokens.kda.foundation.icon.system.mono_trip_origin
kda.foundation.icon.system.mono_troubleshoot
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_troubleshoot)
JavaScript: tokens.kda.foundation.icon.system.mono_troubleshoot
kda.foundation.icon.system.mono_try
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_try)
JavaScript: tokens.kda.foundation.icon.system.mono_try
kda.foundation.icon.system.mono_tune
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_tune)
JavaScript: tokens.kda.foundation.icon.system.mono_tune
kda.foundation.icon.system.mono_tungsten
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_tungsten)
JavaScript: tokens.kda.foundation.icon.system.mono_tungsten
kda.foundation.icon.system.mono_turn_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turn_left)
JavaScript: tokens.kda.foundation.icon.system.mono_turn_left
kda.foundation.icon.system.mono_turn_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turn_right)
JavaScript: tokens.kda.foundation.icon.system.mono_turn_right
kda.foundation.icon.system.mono_turn_sharp_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turn_sharp_left)
JavaScript: tokens.kda.foundation.icon.system.mono_turn_sharp_left
kda.foundation.icon.system.mono_turn_sharp_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turn_sharp_right)
JavaScript: tokens.kda.foundation.icon.system.mono_turn_sharp_right
kda.foundation.icon.system.mono_turn_slight_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turn_slight_left)
JavaScript: tokens.kda.foundation.icon.system.mono_turn_slight_left
kda.foundation.icon.system.mono_turn_slight_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turn_slight_right)
JavaScript: tokens.kda.foundation.icon.system.mono_turn_slight_right
kda.foundation.icon.system.mono_turned_in
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turned_in)
JavaScript: tokens.kda.foundation.icon.system.mono_turned_in
kda.foundation.icon.system.mono_turned_in_not
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_turned_in_not)
JavaScript: tokens.kda.foundation.icon.system.mono_turned_in_not
kda.foundation.icon.system.mono_type_specimen
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_type_specimen)
JavaScript: tokens.kda.foundation.icon.system.mono_type_specimen
kda.foundation.icon.system.mono_u_turn_left
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_u_turn_left)
JavaScript: tokens.kda.foundation.icon.system.mono_u_turn_left
kda.foundation.icon.system.mono_u_turn_right
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_u_turn_right)
JavaScript: tokens.kda.foundation.icon.system.mono_u_turn_right
kda.foundation.icon.system.mono_unarchive
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_unarchive)
JavaScript: tokens.kda.foundation.icon.system.mono_unarchive
kda.foundation.icon.system.mono_undo
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_undo)
JavaScript: tokens.kda.foundation.icon.system.mono_undo
kda.foundation.icon.system.mono_unfold_less
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_unfold_less)
JavaScript: tokens.kda.foundation.icon.system.mono_unfold_less
kda.foundation.icon.system.mono_unfold_less_double
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_unfold_less_double)
JavaScript: tokens.kda.foundation.icon.system.mono_unfold_less_double
kda.foundation.icon.system.mono_unfold_more
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_unfold_more)
JavaScript: tokens.kda.foundation.icon.system.mono_unfold_more
kda.foundation.icon.system.mono_unfold_more_double
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_unfold_more_double)
JavaScript: tokens.kda.foundation.icon.system.mono_unfold_more_double
kda.foundation.icon.system.mono_unpublished
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_unpublished)
JavaScript: tokens.kda.foundation.icon.system.mono_unpublished
kda.foundation.icon.system.mono_unsubscribe
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_unsubscribe)
JavaScript: tokens.kda.foundation.icon.system.mono_unsubscribe
kda.foundation.icon.system.mono_upcoming
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_upcoming)
JavaScript: tokens.kda.foundation.icon.system.mono_upcoming
kda.foundation.icon.system.mono_update
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_update)
JavaScript: tokens.kda.foundation.icon.system.mono_update
kda.foundation.icon.system.mono_update_disabled
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_update_disabled)
JavaScript: tokens.kda.foundation.icon.system.mono_update_disabled
kda.foundation.icon.system.mono_upgrade
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_upgrade)
JavaScript: tokens.kda.foundation.icon.system.mono_upgrade
kda.foundation.icon.system.mono_upload
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_upload)
JavaScript: tokens.kda.foundation.icon.system.mono_upload
kda.foundation.icon.system.mono_upload_file
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_upload_file)
JavaScript: tokens.kda.foundation.icon.system.mono_upload_file
kda.foundation.icon.system.mono_usb
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_usb)
JavaScript: tokens.kda.foundation.icon.system.mono_usb
kda.foundation.icon.system.mono_usb_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_usb_off)
JavaScript: tokens.kda.foundation.icon.system.mono_usb_off
kda.foundation.icon.system.mono_verified
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_verified)
JavaScript: tokens.kda.foundation.icon.system.mono_verified
kda.foundation.icon.system.mono_verified_user
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_verified_user)
JavaScript: tokens.kda.foundation.icon.system.mono_verified_user
kda.foundation.icon.system.mono_vertical_align_bottom
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vertical_align_bottom)
JavaScript: tokens.kda.foundation.icon.system.mono_vertical_align_bottom
kda.foundation.icon.system.mono_vertical_align_center
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vertical_align_center)
JavaScript: tokens.kda.foundation.icon.system.mono_vertical_align_center
kda.foundation.icon.system.mono_vertical_align_top
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vertical_align_top)
JavaScript: tokens.kda.foundation.icon.system.mono_vertical_align_top
kda.foundation.icon.system.mono_vertical_distribute
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vertical_distribute)
JavaScript: tokens.kda.foundation.icon.system.mono_vertical_distribute
kda.foundation.icon.system.mono_vertical_shades
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vertical_shades)
JavaScript: tokens.kda.foundation.icon.system.mono_vertical_shades
kda.foundation.icon.system.mono_vertical_shades_closed
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vertical_shades_closed)
JavaScript: tokens.kda.foundation.icon.system.mono_vertical_shades_closed
kda.foundation.icon.system.mono_vertical_split
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vertical_split)
JavaScript: tokens.kda.foundation.icon.system.mono_vertical_split
kda.foundation.icon.system.mono_vibration
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vibration)
JavaScript: tokens.kda.foundation.icon.system.mono_vibration
kda.foundation.icon.system.mono_video_call
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_call)
JavaScript: tokens.kda.foundation.icon.system.mono_video_call
kda.foundation.icon.system.mono_video_camera_back
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_camera_back)
JavaScript: tokens.kda.foundation.icon.system.mono_video_camera_back
kda.foundation.icon.system.mono_video_camera_front
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_camera_front)
JavaScript: tokens.kda.foundation.icon.system.mono_video_camera_front
kda.foundation.icon.system.mono_video_chat
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_chat)
JavaScript: tokens.kda.foundation.icon.system.mono_video_chat
kda.foundation.icon.system.mono_video_file
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_file)
JavaScript: tokens.kda.foundation.icon.system.mono_video_file
kda.foundation.icon.system.mono_video_label
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_label)
JavaScript: tokens.kda.foundation.icon.system.mono_video_label
kda.foundation.icon.system.mono_video_library
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_library)
JavaScript: tokens.kda.foundation.icon.system.mono_video_library
kda.foundation.icon.system.mono_video_settings
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_settings)
JavaScript: tokens.kda.foundation.icon.system.mono_video_settings
kda.foundation.icon.system.mono_video_stable
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_video_stable)
JavaScript: tokens.kda.foundation.icon.system.mono_video_stable
kda.foundation.icon.system.mono_videocam
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_videocam)
JavaScript: tokens.kda.foundation.icon.system.mono_videocam
kda.foundation.icon.system.mono_videocam_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_videocam_off)
JavaScript: tokens.kda.foundation.icon.system.mono_videocam_off
kda.foundation.icon.system.mono_view_array
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_array)
JavaScript: tokens.kda.foundation.icon.system.mono_view_array
kda.foundation.icon.system.mono_view_carousel
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_carousel)
JavaScript: tokens.kda.foundation.icon.system.mono_view_carousel
kda.foundation.icon.system.mono_view_column
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_column)
JavaScript: tokens.kda.foundation.icon.system.mono_view_column
kda.foundation.icon.system.mono_view_comfy
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_comfy)
JavaScript: tokens.kda.foundation.icon.system.mono_view_comfy
kda.foundation.icon.system.mono_view_comfy_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_comfy_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_view_comfy_alt
kda.foundation.icon.system.mono_view_compact
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_compact)
JavaScript: tokens.kda.foundation.icon.system.mono_view_compact
kda.foundation.icon.system.mono_view_compact_alt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_compact_alt)
JavaScript: tokens.kda.foundation.icon.system.mono_view_compact_alt
kda.foundation.icon.system.mono_view_cozy
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_cozy)
JavaScript: tokens.kda.foundation.icon.system.mono_view_cozy
kda.foundation.icon.system.mono_view_day
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_day)
JavaScript: tokens.kda.foundation.icon.system.mono_view_day
kda.foundation.icon.system.mono_view_headline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_headline)
JavaScript: tokens.kda.foundation.icon.system.mono_view_headline
kda.foundation.icon.system.mono_view_in_ar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_in_ar)
JavaScript: tokens.kda.foundation.icon.system.mono_view_in_ar
kda.foundation.icon.system.mono_view_kanban
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_kanban)
JavaScript: tokens.kda.foundation.icon.system.mono_view_kanban
kda.foundation.icon.system.mono_view_list
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_list)
JavaScript: tokens.kda.foundation.icon.system.mono_view_list
kda.foundation.icon.system.mono_view_module
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_module)
JavaScript: tokens.kda.foundation.icon.system.mono_view_module
kda.foundation.icon.system.mono_view_quilt
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_quilt)
JavaScript: tokens.kda.foundation.icon.system.mono_view_quilt
kda.foundation.icon.system.mono_view_sidebar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_sidebar)
JavaScript: tokens.kda.foundation.icon.system.mono_view_sidebar
kda.foundation.icon.system.mono_view_stream
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_stream)
JavaScript: tokens.kda.foundation.icon.system.mono_view_stream
kda.foundation.icon.system.mono_view_timeline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_timeline)
JavaScript: tokens.kda.foundation.icon.system.mono_view_timeline
kda.foundation.icon.system.mono_view_week
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_view_week)
JavaScript: tokens.kda.foundation.icon.system.mono_view_week
kda.foundation.icon.system.mono_visibility
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_visibility)
JavaScript: tokens.kda.foundation.icon.system.mono_visibility
kda.foundation.icon.system.mono_visibility_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_visibility_off)
JavaScript: tokens.kda.foundation.icon.system.mono_visibility_off
kda.foundation.icon.system.mono_volume_down
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_volume_down)
JavaScript: tokens.kda.foundation.icon.system.mono_volume_down
kda.foundation.icon.system.mono_volume_mute
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_volume_mute)
JavaScript: tokens.kda.foundation.icon.system.mono_volume_mute
kda.foundation.icon.system.mono_volume_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_volume_off)
JavaScript: tokens.kda.foundation.icon.system.mono_volume_off
kda.foundation.icon.system.mono_volume_up
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_volume_up)
JavaScript: tokens.kda.foundation.icon.system.mono_volume_up
kda.foundation.icon.system.mono_volunteer_activism
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_volunteer_activism)
JavaScript: tokens.kda.foundation.icon.system.mono_volunteer_activism
kda.foundation.icon.system.mono_vpn_key
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vpn_key)
JavaScript: tokens.kda.foundation.icon.system.mono_vpn_key
kda.foundation.icon.system.mono_vpn_key_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vpn_key_off)
JavaScript: tokens.kda.foundation.icon.system.mono_vpn_key_off
kda.foundation.icon.system.mono_vpn_lock
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_vpn_lock)
JavaScript: tokens.kda.foundation.icon.system.mono_vpn_lock
kda.foundation.icon.system.mono_w_account
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_w_account)
JavaScript: tokens.kda.foundation.icon.system.mono_w_account
kda.foundation.icon.system.mono_wallet
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wallet)
JavaScript: tokens.kda.foundation.icon.system.mono_wallet
kda.foundation.icon.system.mono_wallpaper
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wallpaper)
JavaScript: tokens.kda.foundation.icon.system.mono_wallpaper
kda.foundation.icon.system.mono_warning
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_warning)
JavaScript: tokens.kda.foundation.icon.system.mono_warning
kda.foundation.icon.system.mono_warning_amber
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_warning_amber)
JavaScript: tokens.kda.foundation.icon.system.mono_warning_amber
kda.foundation.icon.system.mono_watch
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_watch)
JavaScript: tokens.kda.foundation.icon.system.mono_watch
kda.foundation.icon.system.mono_watch_later
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_watch_later)
JavaScript: tokens.kda.foundation.icon.system.mono_watch_later
kda.foundation.icon.system.mono_watch_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_watch_off)
JavaScript: tokens.kda.foundation.icon.system.mono_watch_off
kda.foundation.icon.system.mono_waterfall_chart
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_waterfall_chart)
JavaScript: tokens.kda.foundation.icon.system.mono_waterfall_chart
kda.foundation.icon.system.mono_web
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_web)
JavaScript: tokens.kda.foundation.icon.system.mono_web
kda.foundation.icon.system.mono_web_asset
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_web_asset)
JavaScript: tokens.kda.foundation.icon.system.mono_web_asset
kda.foundation.icon.system.mono_web_asset_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_web_asset_off)
JavaScript: tokens.kda.foundation.icon.system.mono_web_asset_off
kda.foundation.icon.system.mono_web_stories
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_web_stories)
JavaScript: tokens.kda.foundation.icon.system.mono_web_stories
kda.foundation.icon.system.mono_webhook
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_webhook)
JavaScript: tokens.kda.foundation.icon.system.mono_webhook
kda.foundation.icon.system.mono_west
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_west)
JavaScript: tokens.kda.foundation.icon.system.mono_west
kda.foundation.icon.system.mono_whatshot
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_whatshot)
JavaScript: tokens.kda.foundation.icon.system.mono_whatshot
kda.foundation.icon.system.mono_where_to_vote
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_where_to_vote)
JavaScript: tokens.kda.foundation.icon.system.mono_where_to_vote
kda.foundation.icon.system.mono_widgets
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_widgets)
JavaScript: tokens.kda.foundation.icon.system.mono_widgets
kda.foundation.icon.system.mono_width_full
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_width_full)
JavaScript: tokens.kda.foundation.icon.system.mono_width_full
kda.foundation.icon.system.mono_width_normal
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_width_normal)
JavaScript: tokens.kda.foundation.icon.system.mono_width_normal
kda.foundation.icon.system.mono_width_wide
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_width_wide)
JavaScript: tokens.kda.foundation.icon.system.mono_width_wide
kda.foundation.icon.system.mono_wifi
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi
kda.foundation.icon.system.mono_wifi_1_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_1_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_1_bar
kda.foundation.icon.system.mono_wifi_2_bar
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_2_bar)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_2_bar
kda.foundation.icon.system.mono_wifi_find
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_find)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_find
kda.foundation.icon.system.mono_wifi_lock
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_lock)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_lock
kda.foundation.icon.system.mono_wifi_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_off)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_off
kda.foundation.icon.system.mono_wifi_password
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_password)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_password
kda.foundation.icon.system.mono_wifi_protected_setup
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_protected_setup)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_protected_setup
kda.foundation.icon.system.mono_wifi_tethering
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_tethering)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_tethering
kda.foundation.icon.system.mono_wifi_tethering_error
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_tethering_error)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_tethering_error
kda.foundation.icon.system.mono_wifi_tethering_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wifi_tethering_off)
JavaScript: tokens.kda.foundation.icon.system.mono_wifi_tethering_off
kda.foundation.icon.system.mono_wind_power
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wind_power)
JavaScript: tokens.kda.foundation.icon.system.mono_wind_power
kda.foundation.icon.system.mono_window
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_window)
JavaScript: tokens.kda.foundation.icon.system.mono_window
kda.foundation.icon.system.mono_work
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_work)
JavaScript: tokens.kda.foundation.icon.system.mono_work
kda.foundation.icon.system.mono_work_history
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_work_history)
JavaScript: tokens.kda.foundation.icon.system.mono_work_history
kda.foundation.icon.system.mono_work_off
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_work_off)
JavaScript: tokens.kda.foundation.icon.system.mono_work_off
kda.foundation.icon.system.mono_work_outline
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_work_outline)
JavaScript: tokens.kda.foundation.icon.system.mono_work_outline
kda.foundation.icon.system.mono_workspace_premium
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_workspace_premium)
JavaScript: tokens.kda.foundation.icon.system.mono_workspace_premium
kda.foundation.icon.system.mono_workspaces
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_workspaces)
JavaScript: tokens.kda.foundation.icon.system.mono_workspaces
kda.foundation.icon.system.mono_wrap_text
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wrap_text)
JavaScript: tokens.kda.foundation.icon.system.mono_wrap_text
kda.foundation.icon.system.mono_wrong_location
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wrong_location)
JavaScript: tokens.kda.foundation.icon.system.mono_wrong_location
kda.foundation.icon.system.mono_wysiwyg
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_wysiwyg)
JavaScript: tokens.kda.foundation.icon.system.mono_wysiwyg
kda.foundation.icon.system.mono_youtube_searched_for
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_youtube_searched_for)
JavaScript: tokens.kda.foundation.icon.system.mono_youtube_searched_for
kda.foundation.icon.system.mono_zoom_in
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_zoom_in)
JavaScript: tokens.kda.foundation.icon.system.mono_zoom_in
kda.foundation.icon.system.mono_zoom_in_map
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_zoom_in_map)
JavaScript: tokens.kda.foundation.icon.system.mono_zoom_in_map
kda.foundation.icon.system.mono_zoom_out
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_zoom_out)
JavaScript: tokens.kda.foundation.icon.system.mono_zoom_out
kda.foundation.icon.system.mono_zoom_out_map
Value: [icon data URL]
Usage Examples
CSS Variable: var(--kda-foundation-icon-system-mono_zoom_out_map)
JavaScript: tokens.kda.foundation.icon.system.mono_zoom_out_map

🔢 Numbers 11

kda.foundation.zIndex.deepdive
Value: -99999
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-deepdive)
JavaScript: tokens.kda.foundation.zIndex.deepdive
kda.foundation.zIndex.default
Value: 1
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-default)
JavaScript: tokens.kda.foundation.zIndex.default
kda.foundation.zIndex.dialog
Value: 6000
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-dialog)
JavaScript: tokens.kda.foundation.zIndex.dialog
kda.foundation.zIndex.dropdown
Value: 7000
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-dropdown)
JavaScript: tokens.kda.foundation.zIndex.dropdown
kda.foundation.zIndex.modal
Value: 9000
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-modal)
JavaScript: tokens.kda.foundation.zIndex.modal
kda.foundation.zIndex.overlay
Value: 8000
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-overlay)
JavaScript: tokens.kda.foundation.zIndex.overlay
kda.foundation.zIndex.popup
Value: 5000
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-popup)
JavaScript: tokens.kda.foundation.zIndex.popup
kda.foundation.zIndex.spinner
Value: 9050
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-spinner)
JavaScript: tokens.kda.foundation.zIndex.spinner
kda.foundation.zIndex.sticky
Value: 100
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-sticky)
JavaScript: tokens.kda.foundation.zIndex.sticky
kda.foundation.zIndex.surface
Value: 4
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-surface)
JavaScript: tokens.kda.foundation.zIndex.surface
kda.foundation.zIndex.toast
Value: 10000
Usage Examples
CSS Variable: var(--kda-foundation-zIndex-toast)
JavaScript: tokens.kda.foundation.zIndex.toast

🌑 Shadows 3

kda.foundation.effect.shadow.level1

This is the shadow 1 description

Value: 4px 0.5rem 0.5rem 4px #000000
Usage Examples
CSS Variable: var(--kda-foundation-effect-shadow-level1)
JavaScript: tokens.kda.foundation.effect.shadow.level1
kda.foundation.effect.shadow.level2

This is the shadow 2 description

Value: 4rem 4rem 0.5rem 2rem #000000
Usage Examples
CSS Variable: var(--kda-foundation-effect-shadow-level2)
JavaScript: tokens.kda.foundation.effect.shadow.level2
kda.foundation.effect.shadow.level3

This is the shadow 3 description updated

Value: 0px 0px 0.5rem 24px #000000
Usage Examples
CSS Variable: var(--kda-foundation-effect-shadow-level3)
JavaScript: tokens.kda.foundation.effect.shadow.level3

🔄 Transitions 2

kda.foundation.transition.animation.easeOutCubic
Value: 200ms 0ms cubic-bezier(0.33, 1, 0.68, 1)
Usage Examples
CSS Variable: var(--kda-foundation-transition-animation-easeOutCubic)
JavaScript: tokens.kda.foundation.transition.animation.easeOutCubic
kda.foundation.transition.animation.easeOutSine
Value: 200ms 0ms cubic-bezier(0.61, 1, 0.88, 1)
Usage Examples
CSS Variable: var(--kda-foundation-transition-animation-easeOutSine)
JavaScript: tokens.kda.foundation.transition.animation.easeOutSine

📝 Typography 192

The quick brown fox
kda.foundation.typography.font.body.base.bold.@lg

P Bold @ lg Description

Value: Inter 1rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.body.base.bold.@lg
The quick brown fox
kda.foundation.typography.font.body.base.bold.@md

P Bold @ md Description

Value: Inter 0.875rem 500 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.body.base.bold.@md
The quick brown fox
kda.foundation.typography.font.body.base.bold.@sm

P Bold @ sm Description

Value: Inter 0.875rem 500 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.body.base.bold.@sm
The quick brown fox
kda.foundation.typography.font.body.base.bold.@xl

P Bold @ xl Description

Value: Inter 1rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.body.base.bold.@xl
The quick brown fox
kda.foundation.typography.font.body.base.bold.@xs

P Bold @ xs Description

Value: Inter 0.875rem 500 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.body.base.bold.@xs
The quick brown fox
kda.foundation.typography.font.body.base.bold.@xxl

P Bold @ xxl Description

Value: Inter 1rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.body.base.bold.@xxl
The quick brown fox
kda.foundation.typography.font.body.base.regular.@lg

P @lg Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.body.base.regular.@lg
The quick brown fox
kda.foundation.typography.font.body.base.regular.@md

P @md Description

Value: Inter 0.875rem 400 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.body.base.regular.@md
The quick brown fox
kda.foundation.typography.font.body.base.regular.@sm

P @sm Description

Value: Inter 0.875rem 400 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.body.base.regular.@sm
The quick brown fox
kda.foundation.typography.font.body.base.regular.@xl

P @xl Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.body.base.regular.@xl
The quick brown fox
kda.foundation.typography.font.body.base.regular.@xs

P @xs Description

Value: Inter 0.875rem 400 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.body.base.regular.@xs
The quick brown fox
kda.foundation.typography.font.body.base.regular.@xxl

P @xxl Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-base-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.body.base.regular.@xxl
The quick brown fox
kda.foundation.typography.font.body.small.bold.@lg

Small P Bold @ lg Description

Value: Inter 0.875rem 500 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.body.small.bold.@lg
The quick brown fox
kda.foundation.typography.font.body.small.bold.@md

Small P Bold @ md Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.body.small.bold.@md
The quick brown fox
kda.foundation.typography.font.body.small.bold.@sm

Small P Bold @ sm Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.body.small.bold.@sm
The quick brown fox
kda.foundation.typography.font.body.small.bold.@xl

Small P Bold @ xl Description

Value: Inter 0.875rem 500 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.body.small.bold.@xl
The quick brown fox
kda.foundation.typography.font.body.small.bold.@xs

Small P Bold @ xs Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.body.small.bold.@xs
The quick brown fox
kda.foundation.typography.font.body.small.bold.@xxl

Small P Bold @ xxl Description

Value: Inter 0.875rem 500 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.body.small.bold.@xxl
The quick brown fox
kda.foundation.typography.font.body.small.regular.@lg

Small P @lg Description

Value: Inter 0.875rem 400 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.body.small.regular.@lg
The quick brown fox
kda.foundation.typography.font.body.small.regular.@md

Small P @md Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.body.small.regular.@md
The quick brown fox
kda.foundation.typography.font.body.small.regular.@sm

Small P @sm Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.body.small.regular.@sm
The quick brown fox
kda.foundation.typography.font.body.small.regular.@xl

Small P @xl Description

Value: Inter 0.875rem 400 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.body.small.regular.@xl
The quick brown fox
kda.foundation.typography.font.body.small.regular.@xs

Small P @xs Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.body.small.regular.@xs
The quick brown fox
kda.foundation.typography.font.body.small.regular.@xxl

Small P @xxl Description

Value: Inter 0.875rem 400 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-small-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.body.small.regular.@xxl
The quick brown fox
kda.foundation.typography.font.body.smallest.bold.@lg

Smallest P Bold @ lg Description

Value: Inter 0.75rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.bold.@lg
The quick brown fox
kda.foundation.typography.font.body.smallest.bold.@md

Smallest P Bold @ md Description

Value: Inter 0.6875rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.bold.@md
The quick brown fox
kda.foundation.typography.font.body.smallest.bold.@sm

Smallest P Bold @ sm Description

Value: Inter 0.6875rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.bold.@sm
The quick brown fox
kda.foundation.typography.font.body.smallest.bold.@xl

Smallest P Bold @ xl Description

Value: Inter 0.75rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.bold.@xl
The quick brown fox
kda.foundation.typography.font.body.smallest.bold.@xs

Smallest P Bold @ xs Description

Value: Inter 0.6875rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.bold.@xs
The quick brown fox
kda.foundation.typography.font.body.smallest.bold.@xxl

Smallest P Bold @ xxl Description

Value: Inter 0.75rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.bold.@xxl
The quick brown fox
kda.foundation.typography.font.body.smallest.regular.@lg

Smallest P @lg Description

Value: Inter 0.75rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.regular.@lg
The quick brown fox
kda.foundation.typography.font.body.smallest.regular.@md

Smallest P @md Description

Value: Inter 0.6875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.regular.@md
The quick brown fox
kda.foundation.typography.font.body.smallest.regular.@sm

Smallest P @sm Description

Value: Inter 0.6875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.regular.@sm
The quick brown fox
kda.foundation.typography.font.body.smallest.regular.@xl

Smallest P @xl Description

Value: Inter 0.75rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.regular.@xl
The quick brown fox
kda.foundation.typography.font.body.smallest.regular.@xs

Smallest P @xs Description

Value: Inter 0.6875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.regular.@xs
The quick brown fox
kda.foundation.typography.font.body.smallest.regular.@xxl

Smallest P @xxl Description

Value: Inter 0.75rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-body-smallest-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.body.smallest.regular.@xxl
The quick brown fox
kda.foundation.typography.font.h1.@lg

H1 Description

Value: Inter 2.5rem 500 3rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h1-@lg)
JavaScript: tokens.kda.foundation.typography.font.h1.@lg
The quick brown fox
kda.foundation.typography.font.h1.@md

H1 Description

Value: Inter 2rem 500 2.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h1-@md)
JavaScript: tokens.kda.foundation.typography.font.h1.@md
The quick brown fox
kda.foundation.typography.font.h1.@sm

H1 Description

Value: Inter 2rem 500 2.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h1-@sm)
JavaScript: tokens.kda.foundation.typography.font.h1.@sm
The quick brown fox
kda.foundation.typography.font.h1.@xl

H1 Description

Value: Inter 2.5rem 500 3rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h1-@xl)
JavaScript: tokens.kda.foundation.typography.font.h1.@xl
The quick brown fox
kda.foundation.typography.font.h1.@xs

H1 Description

Value: Inter 2rem 500 2.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h1-@xs)
JavaScript: tokens.kda.foundation.typography.font.h1.@xs
The quick brown fox
kda.foundation.typography.font.h1.@xxl

H1 Description

Value: Inter 2.5rem 500 3rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h1-@xxl)
JavaScript: tokens.kda.foundation.typography.font.h1.@xxl
The quick brown fox
kda.foundation.typography.font.h2.@lg

H2 Description

Value: Inter 2rem 500 2.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h2-@lg)
JavaScript: tokens.kda.foundation.typography.font.h2.@lg
The quick brown fox
kda.foundation.typography.font.h2.@md

H2 Description

Value: Inter 1.75rem 500 2rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h2-@md)
JavaScript: tokens.kda.foundation.typography.font.h2.@md
The quick brown fox
kda.foundation.typography.font.h2.@sm

H2 Description

Value: Inter 1.75rem 500 2rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h2-@sm)
JavaScript: tokens.kda.foundation.typography.font.h2.@sm
The quick brown fox
kda.foundation.typography.font.h2.@xl

H2 Description

Value: Inter 2rem 500 2.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h2-@xl)
JavaScript: tokens.kda.foundation.typography.font.h2.@xl
The quick brown fox
kda.foundation.typography.font.h2.@xs

H2 Description

Value: Inter 1.75rem 500 2rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h2-@xs)
JavaScript: tokens.kda.foundation.typography.font.h2.@xs
The quick brown fox
kda.foundation.typography.font.h2.@xxl

H2 Description

Value: Inter 2rem 500 2.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h2-@xxl)
JavaScript: tokens.kda.foundation.typography.font.h2.@xxl
The quick brown fox
kda.foundation.typography.font.h3.@lg

H3 Description

Value: Inter 1.75rem 500 2rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h3-@lg)
JavaScript: tokens.kda.foundation.typography.font.h3.@lg
The quick brown fox
kda.foundation.typography.font.h3.@md

H3 Description

Value: Inter 1.5rem 500 1.75rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h3-@md)
JavaScript: tokens.kda.foundation.typography.font.h3.@md
The quick brown fox
kda.foundation.typography.font.h3.@sm

H3 Description

Value: Inter 1.5rem 500 1.75rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h3-@sm)
JavaScript: tokens.kda.foundation.typography.font.h3.@sm
The quick brown fox
kda.foundation.typography.font.h3.@xl

H3 Description

Value: Inter 1.75rem 500 2rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h3-@xl)
JavaScript: tokens.kda.foundation.typography.font.h3.@xl
The quick brown fox
kda.foundation.typography.font.h3.@xs

H3 Description

Value: Inter 1.5rem 500 1.75rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h3-@xs)
JavaScript: tokens.kda.foundation.typography.font.h3.@xs
The quick brown fox
kda.foundation.typography.font.h3.@xxl

H3 Description

Value: Inter 1.75rem 500 2rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h3-@xxl)
JavaScript: tokens.kda.foundation.typography.font.h3.@xxl
The quick brown fox
kda.foundation.typography.font.h4.@lg

H4 Description

Value: Inter 1.5rem 500 1.75rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h4-@lg)
JavaScript: tokens.kda.foundation.typography.font.h4.@lg
The quick brown fox
kda.foundation.typography.font.h4.@md

H4 Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h4-@md)
JavaScript: tokens.kda.foundation.typography.font.h4.@md
The quick brown fox
kda.foundation.typography.font.h4.@sm

H4 Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h4-@sm)
JavaScript: tokens.kda.foundation.typography.font.h4.@sm
The quick brown fox
kda.foundation.typography.font.h4.@xl

H4 Description

Value: Inter 1.5rem 500 1.75rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h4-@xl)
JavaScript: tokens.kda.foundation.typography.font.h4.@xl
The quick brown fox
kda.foundation.typography.font.h4.@xs

H4 Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h4-@xs)
JavaScript: tokens.kda.foundation.typography.font.h4.@xs
The quick brown fox
kda.foundation.typography.font.h4.@xxl

H4 Description

Value: Inter 1.5rem 500 1.75rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h4-@xxl)
JavaScript: tokens.kda.foundation.typography.font.h4.@xxl
The quick brown fox
kda.foundation.typography.font.h5.@lg

H5 Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h5-@lg)
JavaScript: tokens.kda.foundation.typography.font.h5.@lg
The quick brown fox
kda.foundation.typography.font.h5.@md

H5 Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h5-@md)
JavaScript: tokens.kda.foundation.typography.font.h5.@md
The quick brown fox
kda.foundation.typography.font.h5.@sm

H5 Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h5-@sm)
JavaScript: tokens.kda.foundation.typography.font.h5.@sm
The quick brown fox
kda.foundation.typography.font.h5.@xl

H5 Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h5-@xl)
JavaScript: tokens.kda.foundation.typography.font.h5.@xl
The quick brown fox
kda.foundation.typography.font.h5.@xs

H5 Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h5-@xs)
JavaScript: tokens.kda.foundation.typography.font.h5.@xs
The quick brown fox
kda.foundation.typography.font.h5.@xxl

H5 Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h5-@xxl)
JavaScript: tokens.kda.foundation.typography.font.h5.@xxl
The quick brown fox
kda.foundation.typography.font.h6.@lg

H6 Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h6-@lg)
JavaScript: tokens.kda.foundation.typography.font.h6.@lg
The quick brown fox
kda.foundation.typography.font.h6.@md

H6 Description

Value: Inter 0.875rem 500 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h6-@md)
JavaScript: tokens.kda.foundation.typography.font.h6.@md
The quick brown fox
kda.foundation.typography.font.h6.@sm

H6 Description

Value: Inter 0.875rem 500 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h6-@sm)
JavaScript: tokens.kda.foundation.typography.font.h6.@sm
The quick brown fox
kda.foundation.typography.font.h6.@xl

H6 Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h6-@xl)
JavaScript: tokens.kda.foundation.typography.font.h6.@xl
The quick brown fox
kda.foundation.typography.font.h6.@xs

H6 Description

Value: Inter 0.875rem 500 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h6-@xs)
JavaScript: tokens.kda.foundation.typography.font.h6.@xs
The quick brown fox
kda.foundation.typography.font.h6.@xxl

H6 Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-h6-@xxl)
JavaScript: tokens.kda.foundation.typography.font.h6.@xxl
The quick brown fox
kda.foundation.typography.font.input.monospace.base.regular.@lg

Input Element Code @lg Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-base-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.base.regular.@lg
The quick brown fox
kda.foundation.typography.font.input.monospace.base.regular.@md

Input Element Code @md Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-base-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.base.regular.@md
The quick brown fox
kda.foundation.typography.font.input.monospace.base.regular.@sm

Input Element Code @sm Description

Value: Kode Mono 0.875rem 400 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-base-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.base.regular.@sm
The quick brown fox
kda.foundation.typography.font.input.monospace.base.regular.@xl

Input Element Code @xl Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-base-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.base.regular.@xl
The quick brown fox
kda.foundation.typography.font.input.monospace.base.regular.@xs

Input Element Code @xs Description

Value: Kode Mono 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-base-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.base.regular.@xs
The quick brown fox
kda.foundation.typography.font.input.monospace.base.regular.@xxl

Input Element Code @xxl Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-base-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.base.regular.@xxl
The quick brown fox
kda.foundation.typography.font.input.monospace.mobile.regular.@lg

Input Element Code @lg Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-mobile-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.mobile.regular.@lg
The quick brown fox
kda.foundation.typography.font.input.monospace.mobile.regular.@md

Input Element Code @md Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-mobile-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.mobile.regular.@md
The quick brown fox
kda.foundation.typography.font.input.monospace.mobile.regular.@sm

Input Element Code @sm Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-mobile-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.mobile.regular.@sm
The quick brown fox
kda.foundation.typography.font.input.monospace.mobile.regular.@xl

Input Element Code @xl Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-mobile-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.mobile.regular.@xl
The quick brown fox
kda.foundation.typography.font.input.monospace.mobile.regular.@xs

Input Element Code @xs Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-mobile-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.mobile.regular.@xs
The quick brown fox
kda.foundation.typography.font.input.monospace.mobile.regular.@xxl

Input Element Code @xxl Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-monospace-mobile-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.input.monospace.mobile.regular.@xxl
The quick brown fox
kda.foundation.typography.font.input.ui.base.regular.@lg

Input Element @lg Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-base-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.input.ui.base.regular.@lg
The quick brown fox
kda.foundation.typography.font.input.ui.base.regular.@md

Input Element @md Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-base-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.input.ui.base.regular.@md
The quick brown fox
kda.foundation.typography.font.input.ui.base.regular.@sm

Input Element @sm Description

Value: Inter 0.875rem 400 1.375rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-base-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.input.ui.base.regular.@sm
The quick brown fox
kda.foundation.typography.font.input.ui.base.regular.@xl

Input Element @xl Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-base-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.input.ui.base.regular.@xl
The quick brown fox
kda.foundation.typography.font.input.ui.base.regular.@xs

Input Element @xs Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-base-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.input.ui.base.regular.@xs
The quick brown fox
kda.foundation.typography.font.input.ui.base.regular.@xxl

Input Element @xxl Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-base-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.input.ui.base.regular.@xxl
The quick brown fox
kda.foundation.typography.font.input.ui.mobile.regular.@lg

Input Element @lg Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-mobile-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.input.ui.mobile.regular.@lg
The quick brown fox
kda.foundation.typography.font.input.ui.mobile.regular.@md

Input Element @md Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-mobile-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.input.ui.mobile.regular.@md
The quick brown fox
kda.foundation.typography.font.input.ui.mobile.regular.@sm

Input Element @sm Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-mobile-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.input.ui.mobile.regular.@sm
The quick brown fox
kda.foundation.typography.font.input.ui.mobile.regular.@xl

Input Element @xl Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-mobile-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.input.ui.mobile.regular.@xl
The quick brown fox
kda.foundation.typography.font.input.ui.mobile.regular.@xs

Input Element @xs Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-mobile-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.input.ui.mobile.regular.@xs
The quick brown fox
kda.foundation.typography.font.input.ui.mobile.regular.@xxl

Input Element @xxl Description

Value: Inter 1rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-input-ui-mobile-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.input.ui.mobile.regular.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.base.bold.@lg

Code Bold @ lg Description

Value: Kode Mono 1rem 700 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.bold.@lg
The quick brown fox
kda.foundation.typography.font.monospace.base.bold.@md

Code Bold @ md Description

Value: Kode Mono 0.875rem 700 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.bold.@md
The quick brown fox
kda.foundation.typography.font.monospace.base.bold.@sm

Code Bold @ sm Description

Value: Kode Mono 0.875rem 700 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.bold.@sm
The quick brown fox
kda.foundation.typography.font.monospace.base.bold.@xl

Code Bold @ xl Description

Value: Kode Mono 1rem 700 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.bold.@xl
The quick brown fox
kda.foundation.typography.font.monospace.base.bold.@xs

Code Bold @ xs Description

Value: Kode Mono 0.875rem 700 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.bold.@xs
The quick brown fox
kda.foundation.typography.font.monospace.base.bold.@xxl

Code Bold @ xxl Description

Value: Kode Mono 1rem 700 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.bold.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.base.regular.@lg

Code @lg Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.regular.@lg
The quick brown fox
kda.foundation.typography.font.monospace.base.regular.@md

Code @md Description

Value: Kode Mono 0.875rem 400 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.regular.@md
The quick brown fox
kda.foundation.typography.font.monospace.base.regular.@sm

Code @sm Description

Value: Kode Mono 0.875rem 400 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.regular.@sm
The quick brown fox
kda.foundation.typography.font.monospace.base.regular.@xl

Code @xl Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.regular.@xl
The quick brown fox
kda.foundation.typography.font.monospace.base.regular.@xs

Code @xs Description

Value: Kode Mono 0.875rem 400 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.regular.@xs
The quick brown fox
kda.foundation.typography.font.monospace.base.regular.@xxl

Code @xxl Description

Value: Kode Mono 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-base-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.base.regular.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.large.bold.@lg

Code Bold @ lg Description

Value: Kode Mono 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.bold.@lg
The quick brown fox
kda.foundation.typography.font.monospace.large.bold.@md

Code Bold @ md Description

Value: Kode Mono 1.125rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.bold.@md
The quick brown fox
kda.foundation.typography.font.monospace.large.bold.@sm

Code Bold @ sm Description

Value: Kode Mono 1.125rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.bold.@sm
The quick brown fox
kda.foundation.typography.font.monospace.large.bold.@xl

Code Bold @ xl Description

Value: Kode Mono 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.bold.@xl
The quick brown fox
kda.foundation.typography.font.monospace.large.bold.@xs

Code Bold @ xs Description

Value: Kode Mono 1.125rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.bold.@xs
The quick brown fox
kda.foundation.typography.font.monospace.large.bold.@xxl

Code Bold @ xxl Description

Value: Kode Mono 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.bold.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.large.regular.@lg

Code @lg Description

Value: Kode Mono 1.25rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.regular.@lg
The quick brown fox
kda.foundation.typography.font.monospace.large.regular.@md

Code @md Description

Value: Kode Mono 1.125rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.regular.@md
The quick brown fox
kda.foundation.typography.font.monospace.large.regular.@sm

Code @sm Description

Value: Kode Mono 1.125rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.regular.@sm
The quick brown fox
kda.foundation.typography.font.monospace.large.regular.@xl

Code @xl Description

Value: Kode Mono 1.25rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.regular.@xl
The quick brown fox
kda.foundation.typography.font.monospace.large.regular.@xs

Code @xs Description

Value: Kode Mono 1.125rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.regular.@xs
The quick brown fox
kda.foundation.typography.font.monospace.large.regular.@xxl

Code @xxl Description

Value: Kode Mono 1.25rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-large-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.large.regular.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.small.bold.@lg

Small Code Bold @ lg Description

Value: Kode Mono 0.875rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.bold.@lg
The quick brown fox
kda.foundation.typography.font.monospace.small.bold.@md

Small Code Bold @ md Description

Value: Kode Mono 0.75rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.bold.@md
The quick brown fox
kda.foundation.typography.font.monospace.small.bold.@sm

Small Code Bold @ sm Description

Value: Kode Mono 0.75rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.bold.@sm
The quick brown fox
kda.foundation.typography.font.monospace.small.bold.@xl

Small Code Bold @ xl Description

Value: Kode Mono 0.875rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.bold.@xl
The quick brown fox
kda.foundation.typography.font.monospace.small.bold.@xs

Small Code Bold @ xs Description

Value: Kode Mono 0.75rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.bold.@xs
The quick brown fox
kda.foundation.typography.font.monospace.small.bold.@xxl

Small Code Bold @ xxl Description

Value: Kode Mono 0.875rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.bold.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.small.regular.@lg

Small Code @lg Description

Value: Kode Mono 0.875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.regular.@lg
The quick brown fox
kda.foundation.typography.font.monospace.small.regular.@md

Small Code @md Description

Value: Kode Mono 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.regular.@md
The quick brown fox
kda.foundation.typography.font.monospace.small.regular.@sm

Small Code @sm Description

Value: Kode Mono 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.regular.@sm
The quick brown fox
kda.foundation.typography.font.monospace.small.regular.@xl

Small Code @xl Description

Value: Kode Mono 0.875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.regular.@xl
The quick brown fox
kda.foundation.typography.font.monospace.small.regular.@xs

Small Code @xs Description

Value: Kode Mono 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.regular.@xs
The quick brown fox
kda.foundation.typography.font.monospace.small.regular.@xxl

Small Code @xxl Description

Value: Kode Mono 0.875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-small-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.small.regular.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.smallest.bold.@lg

Smallest Code Bold @ lg Description

Value: Kode Mono 0.75rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.bold.@lg
The quick brown fox
kda.foundation.typography.font.monospace.smallest.bold.@md

Smallest Code Bold @ md Description

Value: Kode Mono 0.6875rem 700 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.bold.@md
The quick brown fox
kda.foundation.typography.font.monospace.smallest.bold.@sm

Smallest Code Bold @ sm Description

Value: Kode Mono 0.6875rem 700 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.bold.@sm
The quick brown fox
kda.foundation.typography.font.monospace.smallest.bold.@xl

Smallest Code Bold @ xl Description

Value: Kode Mono 0.75rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.bold.@xl
The quick brown fox
kda.foundation.typography.font.monospace.smallest.bold.@xs

Smallest Code Bold @ xs Description

Value: Kode Mono 0.6875rem 700 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.bold.@xs
The quick brown fox
kda.foundation.typography.font.monospace.smallest.bold.@xxl

Smallest Code Bold @ xxl Description

Value: Kode Mono 0.75rem 700 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.bold.@xxl
The quick brown fox
kda.foundation.typography.font.monospace.smallest.regular.@lg

Smallest Code @lg Description

Value: Kode Mono 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.regular.@lg
The quick brown fox
kda.foundation.typography.font.monospace.smallest.regular.@md

Smallest Code @md Description

Value: Kode Mono 0.6875rem 400 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.regular.@md
The quick brown fox
kda.foundation.typography.font.monospace.smallest.regular.@sm

Smallest Code @sm Description

Value: Kode Mono 0.6875rem 400 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.regular.@sm
The quick brown fox
kda.foundation.typography.font.monospace.smallest.regular.@xl

Smallest Code @xl Description

Value: Kode Mono 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.regular.@xl
The quick brown fox
kda.foundation.typography.font.monospace.smallest.regular.@xs

Smallest Code @xs Description

Value: Kode Mono 0.6875rem 400 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.regular.@xs
The quick brown fox
kda.foundation.typography.font.monospace.smallest.regular.@xxl

Smallest Code @xxl Description

Value: Kode Mono 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-monospace-smallest-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.monospace.smallest.regular.@xxl
The quick brown fox
kda.foundation.typography.font.ui.base.bold.@lg

P Bold @ lg Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.base.bold.@lg
The quick brown fox
kda.foundation.typography.font.ui.base.bold.@md

P Bold @ md Description

Value: Inter 0.875rem 500 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.base.bold.@md
The quick brown fox
kda.foundation.typography.font.ui.base.bold.@sm

P Bold @ sm Description

Value: Inter 0.875rem 500 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.base.bold.@sm
The quick brown fox
kda.foundation.typography.font.ui.base.bold.@xl

P Bold @ xl Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.base.bold.@xl
The quick brown fox
kda.foundation.typography.font.ui.base.bold.@xs

P Bold @ xs Description

Value: Inter 0.875rem 500 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.base.bold.@xs
The quick brown fox
kda.foundation.typography.font.ui.base.bold.@xxl

P Bold @ xxl Description

Value: Inter 1rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.base.bold.@xxl
The quick brown fox
kda.foundation.typography.font.ui.base.regular.@lg

P @lg Description

Value: Inter 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.base.regular.@lg
The quick brown fox
kda.foundation.typography.font.ui.base.regular.@md

P @md Description

Value: Inter 0.875rem 400 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.base.regular.@md
The quick brown fox
kda.foundation.typography.font.ui.base.regular.@sm

P @sm Description

Value: Inter 0.875rem 400 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.base.regular.@sm
The quick brown fox
kda.foundation.typography.font.ui.base.regular.@xl

P @xl Description

Value: Inter 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.base.regular.@xl
The quick brown fox
kda.foundation.typography.font.ui.base.regular.@xs

P @xs Description

Value: Inter 0.875rem 400 1.125rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.base.regular.@xs
The quick brown fox
kda.foundation.typography.font.ui.base.regular.@xxl

P @xxl Description

Value: Inter 1rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-base-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.base.regular.@xxl
The quick brown fox
kda.foundation.typography.font.ui.large.bold.@lg

P Bold @ lg Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.large.bold.@lg
The quick brown fox
kda.foundation.typography.font.ui.large.bold.@md

P Bold @ md Description

Value: Inter 1.125rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.large.bold.@md
The quick brown fox
kda.foundation.typography.font.ui.large.bold.@sm

P Bold @ sm Description

Value: Inter 1.125rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.large.bold.@sm
The quick brown fox
kda.foundation.typography.font.ui.large.bold.@xl

P Bold @ xl Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.large.bold.@xl
The quick brown fox
kda.foundation.typography.font.ui.large.bold.@xs

P Bold @ xs Description

Value: Inter 1.125rem 500 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.large.bold.@xs
The quick brown fox
kda.foundation.typography.font.ui.large.bold.@xxl

P Bold @ xxl Description

Value: Inter 1.25rem 500 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.large.bold.@xxl
The quick brown fox
kda.foundation.typography.font.ui.large.regular.@lg

P Large @lg Description

Value: Inter 1.25rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.large.regular.@lg
The quick brown fox
kda.foundation.typography.font.ui.large.regular.@md

P Large @md Description

Value: Inter 1.125rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.large.regular.@md
The quick brown fox
kda.foundation.typography.font.ui.large.regular.@sm

P Large @sm Description

Value: Inter 1.125rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.large.regular.@sm
The quick brown fox
kda.foundation.typography.font.ui.large.regular.@xl

P Large @xl Description

Value: Inter 1.25rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.large.regular.@xl
The quick brown fox
kda.foundation.typography.font.ui.large.regular.@xs

P Large @xs Description

Value: Inter 1.125rem 400 1.25rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.large.regular.@xs
The quick brown fox
kda.foundation.typography.font.ui.large.regular.@xxl

P Large @xxl Description

Value: Inter 1.25rem 400 1.5rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-large-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.large.regular.@xxl
The quick brown fox
kda.foundation.typography.font.ui.small.bold.@lg

Small P Bold @ lg Description

Value: Inter 0.875rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.small.bold.@lg
The quick brown fox
kda.foundation.typography.font.ui.small.bold.@md

Small P Bold @ md Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.small.bold.@md
The quick brown fox
kda.foundation.typography.font.ui.small.bold.@sm

Small P Bold @ sm Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.small.bold.@sm
The quick brown fox
kda.foundation.typography.font.ui.small.bold.@xl

Small P Bold @ xl Description

Value: Inter 0.875rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.small.bold.@xl
The quick brown fox
kda.foundation.typography.font.ui.small.bold.@xs

Small P Bold @ xs Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.small.bold.@xs
The quick brown fox
kda.foundation.typography.font.ui.small.bold.@xxl

Small P Bold @ xxl Description

Value: Inter 0.875rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.small.bold.@xxl
The quick brown fox
kda.foundation.typography.font.ui.small.regular.@lg

Small P @lg Description

Value: Inter 0.875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.small.regular.@lg
The quick brown fox
kda.foundation.typography.font.ui.small.regular.@md

Small P @md Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.small.regular.@md
The quick brown fox
kda.foundation.typography.font.ui.small.regular.@sm

Small P @sm Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.small.regular.@sm
The quick brown fox
kda.foundation.typography.font.ui.small.regular.@xl

Small P @xl Description

Value: Inter 0.875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.small.regular.@xl
The quick brown fox
kda.foundation.typography.font.ui.small.regular.@xs

Small P @xs Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.small.regular.@xs
The quick brown fox
kda.foundation.typography.font.ui.small.regular.@xxl

Small P @xxl Description

Value: Inter 0.875rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-small-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.small.regular.@xxl
The quick brown fox
kda.foundation.typography.font.ui.smallest.bold.@lg

Smallest P Bold @ lg Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-bold-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.bold.@lg
The quick brown fox
kda.foundation.typography.font.ui.smallest.bold.@md

Smallest P Bold @ md Description

Value: Inter 0.6875rem 500 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-bold-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.bold.@md
The quick brown fox
kda.foundation.typography.font.ui.smallest.bold.@sm

Smallest P Bold @ sm Description

Value: Inter 0.6875rem 500 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-bold-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.bold.@sm
The quick brown fox
kda.foundation.typography.font.ui.smallest.bold.@xl

Smallest P Bold @ xl Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-bold-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.bold.@xl
The quick brown fox
kda.foundation.typography.font.ui.smallest.bold.@xs

Smallest P Bold @ xs Description

Value: Inter 0.6875rem 500 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-bold-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.bold.@xs
The quick brown fox
kda.foundation.typography.font.ui.smallest.bold.@xxl

Smallest P Bold @ xxl Description

Value: Inter 0.75rem 500 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-bold-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.bold.@xxl
The quick brown fox
kda.foundation.typography.font.ui.smallest.regular.@lg

Smallest P @lg Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-regular-@lg)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.regular.@lg
The quick brown fox
kda.foundation.typography.font.ui.smallest.regular.@md

Smallest P @md Description

Value: Inter 0.6875rem 400 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-regular-@md)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.regular.@md
The quick brown fox
kda.foundation.typography.font.ui.smallest.regular.@sm

Smallest P @sm Description

Value: Inter 0.6875rem 400 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-regular-@sm)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.regular.@sm
The quick brown fox
kda.foundation.typography.font.ui.smallest.regular.@xl

Smallest P @xl Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-regular-@xl)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.regular.@xl
The quick brown fox
kda.foundation.typography.font.ui.smallest.regular.@xs

Smallest P @xs Description

Value: Inter 0.6875rem 400 0.875rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-regular-@xs)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.regular.@xs
The quick brown fox
kda.foundation.typography.font.ui.smallest.regular.@xxl

Smallest P @xxl Description

Value: Inter 0.75rem 400 1rem 0px
Usage Examples
CSS Variable: var(--kda-foundation-typography-font-ui-smallest-regular-@xxl)
JavaScript: tokens.kda.foundation.typography.font.ui.smallest.regular.@xxl